styles to make proposal details more readable

HausDAO · Nov 15, 2023 · 5125301 · 5125301
1 parent 702d5cd
commit 5125301
Showing 1 changed file with 23 additions and 1 deletion.
diff --git a/libs/moloch-v3-macro-ui/src/components/ProposalDetails/ProposalDetails.tsx b/libs/moloch-v3-macro-ui/src/components/ProposalDetails/ProposalDetails.tsx
@@ -35,6 +35,28 @@ const Spacer = styled.div`
   margin-bottom: 2rem;
 `;
 
+const ReactMarkdownWrapper = styled.div`
+
+    font-size: 1.6rem;
+
+    .description {
+      p, h1, h2, h3, h4 {
+        margin-top: 1rem;
+      }
+      h2 + p {
+        margin-top: 0;
+      }
+      h3 + p {
+        margin-top: 0;
+      }
+      h4 + p {
+        margin-top: 0;
+      }
+    }
+
+
+`;
+
 type ProposalDetailsProps = {
   daoChain: string;
   daoId: string;
@@ -61,7 +83,7 @@ export const ProposalDetails = ({
 
   return (
     <OverviewContainer>
-      <ReactMarkdown className="description">{proposal.description}</ReactMarkdown>
+      <ReactMarkdownWrapper><ReactMarkdown className="description">{proposal.description}</ReactMarkdown></ReactMarkdownWrapper>
       {proposal.contentURI && (
         <Link href={proposal.contentURI} className="proposal-link">
           Link