🚧💄 WIP: darkmode/lightmode

src/styles/global.css

@@ -3,65 +3,44 @@
   https://github.com/HermanMartinus/bearblog/blob/297026a877bc2ab2b3bdfbd6b9f7961c350917dd/templates/styles/blog/default.css
   License MIT: https://github.com/HermanMartinus/bearblog/blob/master/LICENSE.md
  */
+
+html {
+	background-color: #FFF8EA;
+	color: #815B5B;
+}
+
+html.dark {
+	background-color: #27374D;
+	color: #DDE6ED;
+}
+
 body {
 	font-family: Verdana, sans-serif;
 	margin: auto;
 	padding: 20px;
 	max-width: 65ch;
 	text-align: left;
-	background-color: #FFF8EA;
 	word-wrap: break-word;
 	overflow-wrap: break-word;
 	line-height: 1.5;
-	color: #815B5B;
 }
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-strong,
-b {
-	color: #222;
+
+#themeToggle {
+	border: 0;
+	background: none;
 }
-a {
-	color: #3273dc;
+.sun {
+	fill: #27374D;
 }
-nav a {
-	margin-right: 10px;
+.moon {
+	fill: white;
 }
-textarea {
-	width: 100%;
-	font-size: 16px;
-}
-input {
-	font-size: 16px;
-}
-content {
-	line-height: 1.6;
-}
-table {
-	width: 100%;
-}
-img {
-	max-width: 100%;
-	height: auto;
-}
-code {
-	padding: 2px 5px;
-	background-color: #f2f2f2;
-}
-pre {
-	padding: 1rem;
-}
-pre > code {
-	all: unset;
-}
-blockquote {
-	border: 1px solid #999;
-	color: #222;
-	padding: 2px 0px 2px 20px;
-	margin: 0px;
-	font-style: italic;
+
+:global(.dark) .sun {
+	fill: white;
+	display: none;
 }
+:global(.dark) .moon {
+	fill: #FFF8EA;
+	display: none;
+}