♻️ code blocks and links (#61)

* 🔧 code styles * 💄 anchor tags
kkrt-labs · Aug 5, 2024 · b3763e1 · b3763e1
1 parent 5a7a15f
commit b3763e1
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 3 deletions.
diff --git a/docusaurus.config.ts b/docusaurus.config.ts
@@ -115,8 +115,8 @@ const config: Config = {
       copyright: `Copyright © ${new Date().getFullYear()} Kakarot ZK-EVM, Inc. Built with Docusaurus.`,
     },
     prism: {
-      theme: prismThemes.github,
-      darkTheme: prismThemes.dracula,
+      theme: prismThemes.nightOwlLight,
+      darkTheme: prismThemes.oneDark,
     },
   } satisfies Preset.ThemeConfig,
 };

diff --git a/src/css/custom.css b/src/css/custom.css
@@ -5,7 +5,7 @@
  */
 
 /* You can override the default Infima variables here. */
-@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;700;800;900&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap");
 
 :root {
   --ifm-color-primary: #003d29;
@@ -19,6 +19,7 @@
   --ifm-navbar-background-color: var(--ifm-background-color);
   --ifm-font-family-base: "Inter Tight", sans-serif;
   --ifm-font-family-monospace: "Inter Tight", monospace;
+  --ifm-code-font-size: 95%;
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
@@ -31,6 +32,9 @@
   --ifm-color-primary-lighter: #ffffff;
   --ifm-color-primary-lightest: #ffffff;
   --ifm-background-color: #003d29;
+  --ifm-font-family-base: "Inter Tight", sans-serif;
+  --ifm-font-family-monospace: "Inter Tight", monospace;
+  --ifm-code-font-size: 95%;
 }
 
 body {
@@ -48,3 +52,22 @@ body {
 .footer__copyright {
   color: #fffadb;
 }
+
+/* Override the font for code blocks */
+code,
+pre {
+  font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono,
+    Courier New;
+}
+
+/* Additional styling for pre to ensure it looks good */
+pre {
+  background-color: #f5f5f5; /* Adjust as necessary */
+  padding: 10px; /* Adjust as necessary */
+  border-radius: 5px; /* Adjust as necessary */
+  overflow-x: auto;
+}
+
+p > a {
+  color: #ff7500 !important;
+}