add material to mikdown giving us nice icons for everything

reorproject · Jan 5, 2024 · aa0c510 · aa0c510
1 parent 1b20629
commit aa0c510
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 13 deletions.
diff --git a/index.html b/index.html
@@ -4,14 +4,15 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/x-icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <!-- <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" /> -->
-    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'"> -->
-    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-eval'; style-src 'self' 'unsafe-inline';">
+    <!-- Updated Content-Security-Policy -->
+    <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-eval'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; font-src 'self' https://fonts.gstatic.com;">
+
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 
     <title>Reor Project</title>
   </head>
   <body>
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
   </body>
-</html>
+</html>
diff --git a/src/components/File/MarkdownEditor.tsx b/src/components/File/MarkdownEditor.tsx
@@ -85,12 +85,12 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({
 
         .use(nord)
         .use(commonmark)
-        // .use(gfm)
+        .use(gfm)
         .use(history)
         .use(listener)
         .use(prism)
         // .use(menu)
-        // .use(block)
+        .use(block)
         .use(cursor)
         .use(clipboard)
     // .use(slash)
@@ -116,7 +116,18 @@ const MarkdownEditor: React.FC<MarkdownEditorProps> = ({
     }
   }, [filePath]);
 
-  return <ReactEditor editor={editor} />;
+  return (
+    <div
+      // className="font-material-icons"
+      style={
+        {
+          // fontFamily: "Material Icons",
+        }
+      }
+    >
+      <ReactEditor editor={editor} />
+    </div>
+  );
 };
 
 export default MarkdownEditor;
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -1,14 +1,15 @@
 /** @type {import('tailwindcss').Config} */
 export default {
-  content: [
-    './index.html',
-    './src/**/*.{js,ts,jsx,tsx}',
-  ],
+  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
   theme: {
-    extend: {},
+    extend: {
+      fontFamily: {
+        // "material-icons": ["Material Icons"],
+      },
+    },
   },
   corePlugins: {
     preflight: false,
   },
   plugins: [],
-}
+};