Tweaks global styles

src/styles/Colors.scss

@@ -2,7 +2,7 @@
 :root {
   /* Greyscale */
   --bright-white: #ffffff;
-  --white: #e5e5e5;
+  --white: #f7f7f7;
   --pale-grey: #e9e9e8;
   --mid-grey: #a9a9a9;
   --dark-grey: ##18191a;
@@ -31,29 +31,13 @@ html { /* Light Theme */
 }
 
 html[data-theme='dark'] { /* Dark Theme */
-  --primary: #202020;
+  --primary: #db78fc;
   --background: var(--dark-grey);
   --text-color: var(--white);
   --hero-background: var(--black);
   --kinda-transparent: #000000d9;
-  --hyperlink: #ff62ce;
+  --hyperlink: var(--primary);
   --feature-img-shadow: 4px 4px 6px #00000080, -2px -2px 4px rgb(0 0 0 / 40%);
   --footer-color: var(--black);
+  --footer-text-color: var(--white);
 }
-
-.footer {
-  box-shadow: var(--feature-img-shadow);
-  --ifm-footer-background-color: var(--footer-color);
-  --ifm-footer-color: var(--footer-text-color);
-  --ifm-footer-link-color: var(--footer-text-color);
-  --ifm-footer-title-color: var(--footer-text-color);
-  --ifm-footer-link-hover-color: var(--primary);
-  --ifm-link-color: var(--footer-text-color);
-  --ifm-link-hover-color: var(--primary);
-  .footer__copyright, .footer__copyright a {
-    font-size: 0.9rem;
-    font-weight: bold;
-    opacity: 0.9;
-    font-family: 'Roboto Mono', monospace;
-  }
-}

src/styles/Header.module.scss

@@ -24,6 +24,16 @@ header.heroBanner {
   h3.heroSubTitle {
     text-shadow: var(--sub-heading-shadow);
   }
+  img.starButton {
+    position: absolute;
+    width: 12rem;
+    top: 1rem;
+    right: 1rem;
+    opacity: 0.85;
+    &:hover {
+      opacity: 1;
+    }
+  }
 }
 .buttons {
   display: flex;
@@ -35,7 +45,7 @@ header.heroBanner {
   }
 }
 .dashyDescription {
-  max-width: 800px;
+  max-width: 680px;
   margin: 1rem auto;
   text-align: left;
   font-size: 1.2rem;

src/styles/custom.scss

@@ -24,6 +24,26 @@
   --ifm-hero-text-color: var(--text-color);
 }
 
+.footer {
+  box-shadow: var(--feature-img-shadow);
+  --ifm-footer-background-color: var(--footer-color);
+  --ifm-footer-color: var(--footer-text-color);
+  --ifm-footer-link-color: var(--footer-text-color);
+  --ifm-footer-title-color: var(--footer-text-color);
+  --ifm-footer-link-hover-color: var(--primary);
+  --ifm-link-color: var(--footer-text-color);
+  --ifm-link-hover-color: var(--primary);
+  .footer__link-item {
+    font-size: 1rem;
+  }
+  .footer__copyright, .footer__copyright a {
+    font-size: 0.9rem;
+    font-weight: bold;
+    opacity: 0.9;
+    font-family: 'Roboto Mono', monospace;
+  }
+}
+
 
 .docusaurus-highlight-code-line {
   background-color: rgba(0, 0, 0, 0.1);
@@ -56,12 +76,22 @@ h1, h2, h3, h4, h5 {
   cursor: default;
 }
 
+/* Markdown Docs content */
 article div.markdown {
+  --ifm-h1-font-size: 3.0rem;
+  --ifm-h2-font-size: 2.5rem;
+  --ifm-h3-font-size: 1.4rem;
   p, a, ol, ul, li, code span {
     font-size: 1rem;
   }
-  h2 {
+  h1 { font-size: var(--ifm-h1-font-size); }
-    font-size: 2.5rem;
+  h2 { font-size: var(--ifm-h2-font-size); }
+  h3 { font-size: var(--ifm-h3-font-size); }
+  p img {
+    border-radius: 4px;
+  }
+  table > tr > td > a > img {
+    border-radius: 6px;
   }
 }
 
@@ -69,10 +99,10 @@ article div.markdown {
 ul.table-of-contents li {
   a {
     font-size: 1rem;
-    &:hover {
+    &:hover, &:hover code {
       color: var(--hyperlink);
     }
-    &.table-of-contents__link--active {
+    &.table-of-contents__link--active, &.table-of-contents__link--active code {
       color: var(--hyperlink);
       font-weight: bold;
     }
@@ -91,3 +121,31 @@ ul.menu__list {
     }
   }
 }
+
+/* Code Blocks */
+
+code span {
+  font-family: 'Roboto Mono', monospace;
+  font-size: 0.9rem !important;
+}
+
+
+html[data-theme='light'] {
+  main div.container.padding-top--md.padding-bottom--lg{
+    padding: 0 1rem !important;
+    div > div.col.docItemCol_node_modules-\@docusaurus-theme-classic-lib-next-theme-DocItem-styles-module {
+      padding: 1rem;
+      background: var(--bright-white);
+      border-right: 1px solid var(--ifm-toc-border-color);
+      ul li a {
+        font-weight: bold;
+      }
+    }
+    .table-of-contents__left-border {
+      border-left: none;
+    }
+    .pagination-nav__label {
+      color: var(--black);
+    }
+  }
+}