Proposal Discussion Responsive Fix'

Author: lazycipher

src/user/proposals/ProposalDiscussion/DiscussionContent/DiscussionContent.scss

@@ -91,3 +91,26 @@
     }
   }
 }
+
+
+@media (min-width: 320px) and (max-width: 1024px){
+  .discussion-content {
+    padding: 2.5vh 2.5vw;
+    height: 100%;
+    .discussion-toppanel {
+      width: 100%;
+      flex-direction: column;
+      margin: 2.5vh 0;
+      align-items: center;
+    }
+    .discussion-bottompanel {
+      flex-direction: column;
+      .proposal-preview {
+        min-height: 50vh;
+      }
+      .comments {
+        padding: 0;
+      }
+    }  
+  }
+}

src/user/proposals/ProposalDiscussion/ProposalDiscussion.js

@@ -10,14 +10,14 @@ class ProposalDiscussion extends Component {
   }
   render() {
     return (
-      <div className="discussion">
-        <div className="discussion__navigation">
-          <Navigation dashboard={this.state.dashboard} />
+      <>
+        <Navigation dashboard={this.state.dashboard} />
+        <div className="discussion">
+          <div className="discussion__content">
+            <DiscussionContent />
+          </div>
         </div>
-        <div className="discussion__content">
-          <DiscussionContent />
-        </div>
-      </div>
+      </>
     );
   }
 }

src/user/proposals/ProposalDiscussion/ProposalDiscussion.scss

@@ -3,11 +3,14 @@
   min-height: 100vh;
   height: auto;
   font-family: Muli, sans-serif;
-  .discussion__navigation {
-    flex: 1;
-    border-right: solid 1px #dfe9f1;
-  }
+  margin-left: 13%;
   .discussion__content {
     flex: 5.5;
   }
 }
+
+@media (min-width: 320px) and (max-width: 1024px){
+  .discussion {
+    margin-left: 0;
+  }
+}