add basic black theme

HEIGE-PCloud · Apr 5, 2021 · fe1d58a · fe1d58a
1 parent 03a080f
commit fe1d58a
Show file tree

Hide file tree

Showing 23 changed files with 8,163 additions and 17 deletions.
diff --git a/assets/css/_core/_base.scss b/assets/css/_core/_base.scss
@@ -27,6 +27,9 @@ html {
   [theme=dark] & {
     background-color: $selection-color-dark;
   }
+  [theme=black] & {
+    background-color: $selection-color-black;
+  }
 }
 
 body {
@@ -39,6 +42,10 @@ body {
     color: $global-font-color-dark;
     background-color: $global-background-color-dark;
   }
+  &[theme=black] {
+    color: $global-font-color-black;
+    background-color: $global-background-color-black;
+  }
 }
 
 @include ms;

diff --git a/assets/css/_mixin/_link.scss b/assets/css/_mixin/_link.scss
@@ -7,6 +7,9 @@
     [theme=dark] & {
       color: if($dark, $global-link-color-dark, $single-link-color-dark);
     }
+    [theme=black] & {
+      color: if($dark, $global-link-color-black, $single-link-color-black);
+    }
   }
 
   a:active,
@@ -16,5 +19,8 @@
     [theme=dark] & {
       color: if($dark, $global-link-hover-color-dark, $single-link-hover-color-dark);
     }
+    [theme=black] & {
+      color: if($dark, $global-link-hover-color-black, $single-link-hover-color-black);
+    }
   }
 }
diff --git a/assets/css/_page/_home.scss b/assets/css/_page/_home.scss
@@ -62,6 +62,9 @@
       [theme=dark] & {
         color: $global-font-secondary-color-dark;
       }
+      [theme=black] & {
+        color: $global-font-secondary-color-black;
+      }
     }
   }
 }
@@ -86,6 +89,10 @@
       color: $global-font-color-dark;
       border-bottom: 1px dashed $global-border-color-dark;
     }
+    [theme=black] & {
+      color: $global-font-color-black;
+      border-bottom: 1px dashed $global-border-color-black;
+    }
 
     .featured-image-preview {
       width: 100%;
@@ -131,6 +138,9 @@
       [theme=dark] & {
         color: $global-font-secondary-color-dark;
       }
+      [theme=black] & {
+        color: $global-font-secondary-color-black;
+      }
 
       h2,
       h3,
@@ -160,6 +170,9 @@
         [theme=dark] & {
           color: $global-font-secondary-color-dark;
         }
+        [theme=black] & {
+          color: $global-font-secondary-color-black;
+        }
       }
     }
 

diff --git a/assets/css/_page/_single.scss b/assets/css/_page/_single.scss
@@ -27,6 +27,9 @@
     [theme=dark] & {
       color: $global-font-secondary-color-dark;
     }
+    [theme=black] & {
+      color: $global-font-secondary-color-black;
+    }
 
     @include link(false, true);
 
@@ -95,6 +98,9 @@
       [theme=dark] & {
         font-weight: bolder;
       }
+      [theme=black] & {
+        font-weight: bolder;
+      }
     }
 
     > h2,
@@ -110,6 +116,9 @@
         [theme=dark] & {
           color: $single-link-color-dark;
         }
+        [theme=black] & {
+          color: $single-link-color-black;
+        }
       }
     }
 
@@ -127,6 +136,9 @@
       [theme=dark] & {
         color: #ddd;
       }
+      [theme=black] & {
+        color: #ddd;
+      }
     }
 
     @include link(false, false);
@@ -137,11 +149,17 @@
       [theme=dark] & b, [theme=dark] & strong {
         color: $single-link-color-dark;
       }
+      [theme=black] & b, [theme=black] & strong {
+        color: $single-link-color-black;
+      }
     }
 
     [theme=dark] a:hover b, [theme=dark] a:hover strong {
       color: $single-link-hover-color-dark;
     }
+    [theme=black] a:hover b, [theme=black] a:hover strong {
+      color: $single-link-hover-color-black;
+    }
 
     ul, ol {
       margin: .5rem 0;
@@ -166,6 +184,13 @@
           color: $global-font-secondary-color-dark;
         }
       }
+      [theme=black] & {
+        background: $code-background-color-black;
+
+        rt {
+          color: $global-font-secondary-color-black;
+        }
+      }
     }
 
     .table-wrapper {
@@ -177,6 +202,9 @@
         [theme=dark] & {
           background-color: $table-background-color-dark;
         }
+        [theme=black] & {
+          background-color: $table-background-color-black;
+        }
       }
 
       > table {
@@ -190,13 +218,19 @@
         [theme=dark] & {
           background: $table-background-color-dark;
         }
+        [theme=black] & {
+          background: $table-background-color-dark;
+        }
 
         thead {
           background: $table-thead-color;
 
           [theme=dark] & {
             background-color: $table-thead-color-dark;
           }
+          [theme=black] & {
+            background-color: $table-thead-color-black;
+          }
         }
 
         th, td {
@@ -206,6 +240,9 @@
           [theme=dark] & {
             border-color: darken($table-thead-color-dark, 2%);
           }
+          [theme=black] & {
+            border-color: darken($table-thead-color-black, 2%);
+          }
         }
       }
     }
@@ -252,6 +289,10 @@
         border-left-color: $blockquote-color-dark;
         background-color: rgba($blockquote-color-dark, .2);
       }
+      [theme=black] & {
+        border-left-color: $blockquote-color-black;
+        background-color: rgba($blockquote-color-black, .2);
+      }
     }
 
     .footnotes {
@@ -260,6 +301,9 @@
       [theme=dark] & {
         color: $global-font-secondary-color-dark;
       }
+      [theme=black] & {
+        color: $global-font-secondary-color-black;
+      }
 
       p {
         margin: .25rem 0;
@@ -283,6 +327,9 @@
       [theme=dark] & {
         border-top: 1px dashed $global-border-color-dark;
       }
+      [theme=black] & {
+        border-top: 1px dashed $global-border-color-black;
+      }
     }
 
     kbd {
@@ -304,6 +351,13 @@
         @include box-shadow(inset 0 -1px 0 $global-border-color-dark);
         color: $code-color-dark;
       }
+      [theme=black] & {
+        background-color: $global-background-color-black;
+        border: 1px solid $global-border-color-black;
+        border-bottom-color: $global-border-color-black;
+        @include box-shadow(inset 0 -1px 0 $global-border-color-black);
+        color: $code-color-black;
+      }
     }
 
     .typeit {

diff --git a/assets/css/_partial/_archive/_tags.scss b/assets/css/_partial/_archive/_tags.scss
@@ -22,6 +22,9 @@
       [theme=dark] & {
         color: $global-font-secondary-color-dark;
       }
+      [theme=black] & {
+        color: $global-font-secondary-color-black;
+      }
     }
   }
 }
diff --git a/assets/css/_partial/_archive/_terms.scss b/assets/css/_partial/_archive/_terms.scss
@@ -65,6 +65,13 @@
       color: $global-link-hover-color-dark;
     }
   }
+  [theme=black] & {
+    color: $global-link-color-black;
+
+    &:hover {
+      color: $global-link-hover-color-black;
+    }
+  }
 }
 
 .archive-item-date {
@@ -75,6 +82,9 @@
   [theme=dark] & {
     color: $global-font-secondary-color-dark;
   }
+  [theme=black] & {
+    color: $global-font-secondary-color-black;
+  }
 }
 
 .more-post {

diff --git a/assets/css/_partial/_cookieconsent.scss b/assets/css/_partial/_cookieconsent.scss
@@ -9,6 +9,13 @@
     [theme=dark] & {
       color: $global-font-color;
 
+      &:hover, &:focus {
+        background-color: #fff;
+      }
+    }
+    [theme=black] & {
+      color: $global-font-color;
+
       &:hover, &:focus {
         background-color: #fff;
       }

diff --git a/assets/css/_partial/_details.scss b/assets/css/_partial/_details.scss
@@ -12,6 +12,9 @@
     [theme=dark] & {
       color: $global-font-secondary-color-dark;
     }
+    [theme=black] & {
+      color: $global-font-secondary-color-black;
+    }
   }
 
   .details-content {

diff --git a/assets/css/_partial/_fixed-button.scss b/assets/css/_partial/_fixed-button.scss
@@ -34,6 +34,14 @@
       color: $global-font-color-dark;
     }
   }
+  [theme=black] & {
+    color: $global-font-secondary-color-black;
+    background: $header-background-color-black;
+
+    &:hover, &:active {
+      color: $global-font-color-black;
+    }
+  }
 }
 
 #back-to-top {