Merge pull request #837 from CodeForAfrica/fix/civicsignalblog_longfo…

…rm_link @/civicsignalblog longform link font
CodeForAfrica · Aug 13, 2024 · e44dc81 · e44dc81
2 parents d54a423 + baf324a
commit e44dc81
Show file tree

Hide file tree

Showing 7 changed files with 24 additions and 19 deletions.
diff --git a/apps/civicsignalblog/contrib/dokku/Dockerfile b/apps/civicsignalblog/contrib/dokku/Dockerfile
@@ -1 +1 @@
-FROM codeforafrica/codeforafrica-ui:0.1.8
+FROM codeforafrica/codeforafrica-ui:0.1.9
diff --git a/apps/civicsignalblog/package.json b/apps/civicsignalblog/package.json
@@ -1,6 +1,6 @@
 {
   "name": "civicsignalblog",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "private": true,
   "author": "Code for Africa <[email protected]>",
   "description": "This is the (temporary) CivicSignal blog",

diff --git a/apps/civicsignalblog/src/components/CMSContent/CMSContent.snap.js b/apps/civicsignalblog/src/components/CMSContent/CMSContent.snap.js
@@ -6,14 +6,14 @@ exports[`<CMSContent /> renders unchanged 1`] = `
     class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed MuiContainer-disableGutters css-1y3f71u-MuiContainer-root"
   >
     <div
-      class="MuiBox-root css-6cogad"
+      class="MuiBox-root css-17be2kn"
     >
       <p
         class="MuiTypography-root MuiTypography-body1 css-oo170e-MuiTypography-root"
       >
         Women make up only 22% of the people seen, heard or read about in the news in Africa, the results of the 
         <a
-          class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiTypography-root MuiTypography-body1 css-ww82j7-MuiTypography-root-MuiLink-root-MuiTypography-root"
+          class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiTypography-root MuiTypography-inherit css-1yokalx-MuiTypography-root-MuiLink-root-MuiTypography-root"
           href="https://whomakesthenews.org/gmmp-2020-final-reports/"
           rel="noreferrer noopener"
           target="_blank"

diff --git a/apps/civicsignalblog/src/components/LongFormRichText/LongFormRichText.js b/apps/civicsignalblog/src/components/LongFormRichText/LongFormRichText.js
@@ -54,11 +54,8 @@ const LongFormRichText = React.forwardRef((props, ref) => {
           },
         },
         "& a": {
-          ...theme.typography.body1,
-          mb: 2,
-          [theme.breakpoints.up("md")]: {
-            ...theme.typography.body3,
-          },
+          font: "inherit",
+          margin: "inherit",
         },
         "& ul": {
           mb: 2,

diff --git a/apps/civicsignalblog/src/components/LongFormRichText/LongFormRichText.snap.js b/apps/civicsignalblog/src/components/LongFormRichText/LongFormRichText.snap.js
@@ -3,14 +3,14 @@
 exports[`<LongFormRichText /> renders unchanged 1`] = `
 <div>
   <div
-    class="MuiBox-root css-6cogad"
+    class="MuiBox-root css-17be2kn"
   >
     <p
       class="MuiTypography-root MuiTypography-body1 css-oo170e-MuiTypography-root"
     >
       Women make up only 22% of the people seen, heard or read about in the news in Africa, the results of the 
       <a
-        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiTypography-root MuiTypography-body1 css-ww82j7-MuiTypography-root-MuiLink-root-MuiTypography-root"
+        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiTypography-root MuiTypography-inherit css-1yokalx-MuiTypography-root-MuiLink-root-MuiTypography-root"
         href="https://whomakesthenews.org/gmmp-2020-final-reports/"
         rel="noreferrer noopener"
         target="_blank"

diff --git a/apps/civicsignalblog/src/components/RichText/RichText.js b/apps/civicsignalblog/src/components/RichText/RichText.js
@@ -1,6 +1,7 @@
 /* eslint-disable react/no-array-index-key */
 import { Link, RichTypography } from "@commons-ui/next";
 import { Box } from "@mui/material";
+import { deepmerge } from "@mui/utils";
 import React, { Fragment } from "react";
 import { Text } from "slate";
 
@@ -30,49 +31,56 @@ const serialize = (children, props) =>
     if (!node) {
       return null;
     }
+    const nodeProps = deepmerge(DEFAULT_PROPS, props, { clone: true });
     // TODO(kilemensi): handle node.type === indent
     switch (node.type) {
       case "h1":
         return (
-          <RichTypography {...DEFAULT_PROPS} {...props} variant="h1" key={i}>
+          <RichTypography {...nodeProps} variant="h1" key={i}>
             {serialize(node.children)}
           </RichTypography>
         );
       case "h2":
         return (
-          <RichTypography {...DEFAULT_PROPS} {...props} variant="h2" key={i}>
+          <RichTypography {...nodeProps} variant="h2" key={i}>
             {serialize(node.children)}
           </RichTypography>
         );
       case "h3":
         return (
-          <RichTypography {...DEFAULT_PROPS} {...props} variant="h3" key={i}>
+          <RichTypography {...nodeProps} variant="h3" key={i}>
             {serialize(node.children)}
           </RichTypography>
         );
       case "h4":
         return (
-          <RichTypography {...DEFAULT_PROPS} {...props} variant="h4" key={i}>
+          <RichTypography {...nodeProps} variant="h4" key={i}>
             {serialize(node.children)}
           </RichTypography>
         );
       case "h5":
         return (
-          <RichTypography {...DEFAULT_PROPS} {...props} variant="h5" key={i}>
+          <RichTypography {...nodeProps} variant="h5" key={i}>
             {serialize(node.children)}
           </RichTypography>
         );
       case "h6":
         return (
-          <RichTypography {...DEFAULT_PROPS} {...props} variant="h6" key={i}>
+          <RichTypography {...nodeProps} variant="h6" key={i}>
             {serialize(node.children)}
           </RichTypography>
         );
       case "quote":
         return <blockquote key={i}>{serialize(node.children)}</blockquote>;
       case "link":
         return (
-          <RichTypography component={Link} href={node.href} key={i} {...props}>
+          <RichTypography
+            {...nodeProps}
+            component={Link}
+            href={node.href}
+            variant="inherit"
+            key={i}
+          >
             {serialize(node.children)}
           </RichTypography>
         );

diff --git a/apps/civicsignalblog/src/components/RichText/RichText.snap.js b/apps/civicsignalblog/src/components/RichText/RichText.snap.js
@@ -20,7 +20,7 @@ exports[`<RichText /> renders unchanged 1`] = `
     >
       The project currently supports initiatives in 11 countries. Find out more 
       <a
-        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiTypography-root MuiTypography-body1 active css-8fqbjx-MuiTypography-root-MuiLink-root-MuiTypography-root"
+        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiTypography-root MuiTypography-inherit active css-wuk3dh-MuiTypography-root-MuiLink-root-MuiTypography-root"
         href="/"
       >
         here
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		FROM codeforafrica/codeforafrica-ui:0.1.8
		FROM codeforafrica/codeforafrica-ui:0.1.9