Switch theme to purple accent

Signed-off-by: Kaustav Das Modak <[email protected]>
kaustavdm · Jul 15, 2021 · 1f6dc24 · 1f6dc24 · vercel · Jul 15, 2021
1 parent 64c786f
commit 1f6dc24
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 12 deletions.
diff --git a/theme/css/main.scss b/theme/css/main.scss
@@ -13,7 +13,9 @@ html {
   box-sizing: border-box;
 }
 
-*, *:before, *:after {
+*,
+*:before,
+*:after {
   box-sizing: inherit;
 }
 
@@ -103,15 +105,34 @@ figure {
       overflow-y: scroll;
       max-height: 80vh;
       max-width: 100%;
-      padding: 0.5rem;
       margin: 0;
+      padding: 2rem;
       border-radius: 0.25rem;
-      background-color: lighten($dark-body-bg, 5%);
+      background-color: lighten($dark-body-bg, 10%);
+      color: lighten($dark-text-color, 10%);
       line-height: 1;
     }
 
+    hr:not(.footnotes-sep):after {
+      display: block;
+      text-align: center;
+      content: "...";
+      color: darken($dark-text-color, 20%);
+      font-size: 1rem;
+      height: 1rem;
+      line-height: 1rem;
+      clear: both;
+      border: none;
+    }
+
+    hr:not(.footnotes-sep) {
+      border: none;
+    }
+
     hr {
       margin: 4rem;
+      color: darken($dark-text-color, 20%);
+      background: transparent;
     }
 
     code {
@@ -219,13 +240,13 @@ figure {
 
   a.button {
     padding: 1rem 2rem;
-    background-color: $light-body-bg;
+    background-color: darken($light-body-bg, 10%);
     color: $light-text-color;
     transition: background-color 0.5s ease-out, color 0.25s ease-in;
 
     &.primary {
       background-color: $light-link-color;
-      color: $light-text-color;
+      color: $light-body-bg;
     }
 
     &:hover {

diff --git a/theme/css/mixins.scss b/theme/css/mixins.scss
@@ -19,13 +19,17 @@
       color: $dark-link-color;
       text-decoration: none;
 
+      &:not(.button) {
+        text-shadow: 0px 1px 0px #000;
+      }
+
       &:hover {
-        color: lighten($dark-link-color, 50%);
+        color: lighten($dark-link-color, 20%);
       }
     }
 
     .subtitle, .meta {
-      color: darken($dark-text-color, 50%);
+      color: darken($dark-text-color, 20%);
     }
   }
 
@@ -43,6 +47,10 @@
     text-decoration: none;
     color: $light-link-color;
 
+    &:not(.button) {
+      text-shadow: none !important;
+    }
+
     &:hover {
       color: darken($light-link-color, 50%);
     }
@@ -54,13 +62,19 @@
       text-decoration: none;
 
       &:hover {
-        color: darken($light-link-color, 15%);
+        color: darken($light-link-color, 15%) !important;
       }
     }
 
+    hr:after {
+      color: lighten($light-text-color, 25%) !important;
+    }
+
     .subtitle, .meta {
-      color: lighten($light-text-color, 25%);
+      color: lighten($light-text-color, 25%) !important;
     }
+
+
   }
 
   .card {

diff --git a/theme/css/top-bar.scss b/theme/css/top-bar.scss
@@ -21,7 +21,8 @@ nav.top-bar {
     }
 
     &:hover {
-      background-color: darken($light-body-bg, 10%);
+      color: $dark-text-color;
+      background-color: lighten($dark-body-bg, 10%);
     }
   }
 }
diff --git a/theme/css/variables.scss b/theme/css/variables.scss
@@ -11,11 +11,11 @@ $dark-class: "theme-dark";
 $dark-mediaquery: "(prefers-color-scheme: dark)";
 $dark-body-bg: #222222;
 $dark-text-color: #d7d7d7;
-$dark-link-color: #15beec;
+$dark-link-color: rgb(235, 6, 235);
 
 // colour: Light
 $light-class: "theme-light";
 $light-mediaquery: "(prefers-color-scheme: light)";
 $light-body-bg: #d7d7d7;
 $light-text-color: #222222;
-$light-link-color: #009ec9
+$light-link-color: rgb(116, 3, 116);