UserProposalDashboard Responsiveness Fix

Author: lazycipher

src/user/profile/profile-feed.scss

@@ -1,7 +1,7 @@
 .feed-posts {
   display: flex;
   flex-direction: column;
-  width: 140%;
+  width: 100%;
   h1 {
     font-size: 26px;
     font-weight: bold;

src/user/proposals/UserProposalDashboard/DashboardContent/DashboardContent.scss

@@ -177,3 +177,36 @@
     }
   }
 }
+
+@media (min-width: 320px) and (max-width: 1024px){
+  .dashboard-content {
+    padding: 0;
+    height: 100%;
+    .searchbar-container {
+      .button-container {
+        .posts {
+          width: 100%;
+          .category {
+            text-align: center;
+            button {
+              margin: 5px;
+            }
+          }
+        }
+      }
+    }
+    .proposal-container{
+      .proposals {
+        .single-proposal {
+          .proposal-content {
+            .proposal-options {
+              .option-btn {
+                  margin-top: 5px;
+              }
+            }
+          }
+        }
+      }
+    } 
+  }
+}

src/user/proposals/UserProposalDashboard/UserProposalDashboard.js

@@ -14,17 +14,17 @@ class UserProposalDashboard extends Component {
   }
   render() {
     return (
-      <div className="proposal_dashboard">
-        <div className="proposal_dashboard__navigation">
-          <Navigation dashboard={this.state.dashboard} />
+      <>
+        <Navigation dashboard={this.state.dashboard} />
+        <div className="proposal_dashboard">
+          <div className="proposal_dashboard__content">
+            <DashboardContent />
+          </div>
+          <div className="proposal_dashboard__rightpanel">
+            <DashboardRightPanel />
+          </div>
         </div>
-        <div className="proposal_dashboard__content">
-          <DashboardContent />
-        </div>
-        <div className="proposal_dashboard__rightpanel">
-          <DashboardRightPanel />
-        </div>
-      </div>
+      </>
     );
   }
 }

src/user/proposals/UserProposalDashboard/UserProposalDashboard.scss

@@ -1,16 +1,27 @@
 .proposal_dashboard {
-  // display: flex;
+  display: flex;
   min-height: 100vh;
   height: auto;
   font-family: Muli, sans-serif;
-  .proposal_dashboard__navigation {
-    flex: 1;
-    border-right: solid 1px #dfe9f1;
-  }
+  margin-left: 13%;
   .proposal_dashboard__content {
     flex: 4;
   }
   .proposal_dashboard__rightpanel {
     flex: 2;
   }
 }
+
+@media (min-width: 320px) and (max-width: 1024px){
+  .proposal_dashboard {
+    padding: 2.5vh 2.5vw;
+    margin-left: 0;
+    flex-direction: column;
+    .proposal_dashboard__content {
+      flex: 1;
+    }
+    .proposal_dashboard__rightpanel {
+      flex: 1;
+    }
+  }
+}