Beginning of size logic

sass/sidebar.scss

@@ -1,4 +1,12 @@
 // Sidebar
+[data-theme="light"] {
+  --sb-color: #101419;
+}
+
+[data-theme="dark"] {
+  --sb-color: #09090c;
+}
+
 #sidebar {
   width: 8em;
   height: 100%;
@@ -14,7 +22,7 @@
   padding: 0;
   font-size: 1.6em;
 
-  background-color: #101419;
+  background-color: var(--sb-color);
 }
 
 .sb_header {
@@ -52,6 +60,22 @@
   max-width: calc(100% - 2em);
 }
 
+.theme-toggle-button {
+  background-color: var(--bg-color);
+  color: var(--text-color);
+  border: none;
+  margin-bottom: 10px;
+  width: 100%;
+
+  cursor: crosshair;
+
+  font-size: 18px;
+  text-align: center;
+  text-decoration: none;
+  display: inline-block;
+}
+
+
 .personal { color:#fc3f5b; }
 .nixfox { color:#2abafc; }