Dark mode on index.html

1 files changed, 58 insertions, 8 deletions

diff --git a/index.html b/index.html
index fe0e403..81edc2f 100644
--- a/index.html
+++ b/index.html
@@ -4,16 +4,66 @@
 <meta charset="utf-8">
 <title>Tom Smeding</title>
 <style>
-body{
-	font-family:"Courier New",Courier,Monospace;
-	text-align:center;
+/* Source: https://github.com/madmalik/mononoki/blob/master/style.css */
+@font-face {
+    font-family: 'mononoki-webfont';
+    src: url('/fonts/mononoki-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+         url('/fonts/mononoki-Regular.woff2') format('woff2'), /* Super Modern Browsers */
+         url('/fonts/mononoki-Regular.woff') format('woff'), /* Pretty Modern Browsers */
+         url('/fonts/mononoki-Regular.ttf') format('truetype'); /* Safari, Android, iOS */
+    font-weight: normal;
+    font-style: normal;
 }
-div.main-content{
-	display:inline-block;
-	max-width:800px;
+@font-face {
+    font-family: 'mononoki-webfont';
+    src: url('/fonts/mononoki-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+         url('/fonts/mononoki-Bold.woff2') format('woff2'), /* Super Modern Browsers */
+         url('/fonts/mononoki-Bold.woff') format('woff'), /* Pretty Modern Browsers */
+         url('/fonts/mononoki-Bold.ttf') format('truetype'); /* Safari, Android, iOS */
+    font-weight: bold;
+    font-style: normal;
 }
-#pubs-ul{
-	text-align:left;
+@font-face {
+    font-family: 'mononoki-webfont';
+    src: url('/fonts/mononoki-Italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+         url('/fonts/mononoki-Italic.woff2') format('woff2'), /* Super Modern Browsers */
+         url('/fonts/mononoki-Italic.woff') format('woff'), /* Pretty Modern Browsers */
+         url('/fonts/mononoki-Italic.ttf') format('truetype'); /* Safari, Android, iOS */
+    font-weight: normal;
+    font-style: italic;
+}
+@font-face {
+    font-family: 'mononoki-webfont';
+    src: url('/fonts/mononoki-BoldItalic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+         url('/fonts/mononoki-BoldItalic.woff2') format('woff2'), /* Super Modern Browsers */
+         url('/fonts/mononoki-BoldItalic.woff') format('woff'), /* Pretty Modern Browsers */
+         url('/fonts/mononoki-BoldItalic.ttf') format('truetype'); /* Safari, Android, iOS */
+    font-weight: bold;
+    font-style: italic;
+}
+
+body {
+	font-family: mononoki, mononoki-webfont, "Courier New", Courier, Monospace;
+	text-align: center;
+}
+div.main-content {
+	display: inline-block;
+	max-width: 800px;
+}
+#pubs-ul {
+	text-align: left;
+}
+@media (prefers-color-scheme: dark) {
+	body {
+		color: #eee;
+		background-color: #181818;
+	}
+	a {
+		color: #bbf;
+	}
+	a:visited {
+		color: #99f;
+	}
 }
 </style>
 </head>