Add defaults

assets/scss/_buttons.scss

@@ -21,6 +21,8 @@ a.button {
   appearance: none;
   cursor: pointer;
   outline: none;
+  // Default
+  background: $light-background-header;
 
   @media (prefers-color-scheme: dark) {
     background: $dark-background-header;
@@ -44,6 +46,8 @@ a.button {
     background: transparent;
     box-shadow: none;
     padding: 8px 18px;
+    // Default
+    border-color: $light-background-secondary;
 
     @media (prefers-color-scheme: dark) {
       border-color: $dark-background-secondary;
@@ -111,6 +115,8 @@ a.button {
     appearance: none;
     cursor: pointer;
     outline: none;
+    // Default
+    background: $light-background-secondary;
 
     @media (prefers-color-scheme: dark) {
       background: $dark-background-secondary;

assets/scss/_header.scss

@@ -4,6 +4,8 @@
   justify-content: center;
   position: relative;
   padding: 20px;
+  // Default
+  background: $light-background-header;
 
   @media (prefers-color-scheme: dark) {
     background: $dark-background-header;

assets/scss/_list.scss

@@ -10,6 +10,9 @@
   }
 
   &:not(:last-of-type) {
+    // Default
+    border-bottom: 1px solid $light-border-color;
+
     @media (prefers-color-scheme: dark) {
       border-bottom: 1px solid $dark-border-color;
     }

assets/scss/_main.scss

@@ -29,6 +29,10 @@ body {
   min-height: 100vh;
   flex-direction: column;
 
+  // Default
+  background-color: $light-background;
+  color: $light-color;
+
   @media #{$media-size-phone} {
     font-size: 1rem;
   }
@@ -186,6 +190,9 @@ figure {
 }
 
 em, i, strong {
+  // Default
+  color: black;
+
   @media (prefers-color-scheme: dark) {
     color: white;
   }
@@ -211,6 +218,8 @@ code {
   margin: 0 2px;
   border-radius: 5px;
   font-size: 0.95rem;
+  // Default
+  background: $light-background-secondary;
 
   @media (prefers-color-scheme: dark) {
     background: $dark-background-secondary;
@@ -246,6 +255,8 @@ pre {
     margin: 0;
     padding: 0;
     font-size: inherit;
+    // Default
+    color: #ccc;
 
     @media (prefers-color-scheme: dark) {
       color: inherit;
@@ -333,6 +344,8 @@ hr {
   width: 100%;
   border: none;
   height: 1px;
+  // Default
+  background: $light-border-color;
 
   @media (prefers-color-scheme: dark) {
     background: $dark-border-color;

assets/scss/_menu.scss

@@ -1,5 +1,7 @@
 .menu {
   z-index: 9999;
+  // Default
+  background: $light-background-header;
 
   @media (prefers-color-scheme: dark) {
     background: $dark-background-header;

assets/scss/_single.scss

@@ -115,6 +115,9 @@
       text-decoration: none;
       letter-spacing: 0.1em;
       z-index: 1;
+      // Default
+      background: $light-background;
+      color: $light-color-secondary;
 
       @media (prefers-color-scheme: dark) {
         background: $dark-background;
@@ -171,6 +174,8 @@
   padding: 0;
   cursor: pointer;
   appearance: none;
+  // Default
+  background: $light-background-secondary;
 
   @media (prefers-color-scheme: dark) {
     background: $dark-background-secondary;

assets/scss/_tables.scss

@@ -9,6 +9,8 @@
     th,
     td {
       padding: 12px 15px;
+      // Default
+      border: 1px solid $light-table-color;
       
       @media (prefers-color-scheme: dark) {
         border: 1px solid $dark-table-color;
@@ -30,6 +32,9 @@
     thead {
       tr {
         text-align: left;
+        // Default
+        background-color: $light-table-color;
+        color: $light-color;
 
         @media (prefers-color-scheme: dark) {
           background-color: $dark-table-color;
@@ -55,6 +60,9 @@
 
     tbody {
       tr {
+        // Default
+        border: 1px solid $light-table-color;
+        
         @media (prefers-color-scheme: dark) {
           border: 1px solid $dark-table-color;
         }