Lazy Loaded Rich Text

YashTotale · Jul 2, 2021 · 508d4d1 · 508d4d1
1 parent 21f3bf1
commit 508d4d1
Show file tree

Hide file tree

Showing 14 changed files with 301 additions and 219 deletions.
diff --git a/src/Components/Content/Badge/Loading.tsx b/src/Components/Content/Badge/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Content/Book/Preview/Loading.tsx b/src/Components/Content/Book/Preview/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Content/Experience/Preview/Preview.tsx b/src/Components/Content/Experience/Preview/Preview.tsx
@@ -75,8 +75,12 @@ const useStyles = makeStyles((theme) => ({
     padding: theme.spacing(2),
   },
   description: {
+    width: "100%",
     textAlign: "center",
   },
+  responsibilities: {
+    width: "100%",
+  },
   minis: {
     display: "flex",
     flexWrap: "wrap",
@@ -137,7 +141,7 @@ const Preview: FC<PreviewProps> = (props) => {
             variant={isSizeXS ? "body2" : "body1"}
           />
         </div>
-        <div>
+        <div className={classes.responsibilities}>
           <RichText
             richText={experience.responsibilities as Document}
             toMatch={props.search}

diff --git a/src/Components/Content/Shared/Associated/Loading.tsx b/src/Components/Content/Shared/Associated/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Content/Shared/Mini/Loading.tsx b/src/Components/Content/Shared/Mini/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Content/Tag/Associated/Loading.tsx b/src/Components/Content/Tag/Associated/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Content/Tag/Mini/Loading.tsx b/src/Components/Content/Tag/Mini/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Content/Tag/Preview/Loading.tsx b/src/Components/Content/Tag/Preview/Loading.tsx
@@ -2,7 +2,7 @@
 import React, { FC } from "react";
 import clsx from "clsx";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/Navigation/NavButton/Loading.tsx b/src/Components/Navigation/NavButton/Loading.tsx
@@ -3,7 +3,7 @@ import React, { FC } from "react";
 import clsx from "clsx";
 import { NavButtonProps } from "./NavButton";
 
-// Material UI Lab
+// Material UI Imports
 import { makeStyles, Theme } from "@material-ui/core";
 import { Skeleton } from "@material-ui/lab";
 

diff --git a/src/Components/RichText.tsx b/src/Components/RichText.tsx