css: add dark theme

Author: paper42

assets/css/misc.css

@@ -261,3 +261,75 @@ h1[id], h2[id], h3[id], h4[id], h5[id], h6[id] {
   background-color: #ddd;
   color: #535353;
 }
+@media (prefers-color-scheme: dark) {
+  body {
+    color: #ccc;
+    background-color: #222;
+  }
+  h1, h2, h3, h4, h5, h6 { color: #ccc; }
+  a {
+    color: #62b086;
+  }
+  a:hover {
+    color: #ccc;
+  }
+  hr {
+    border-top: 1px solid #888;
+  }
+  .inline-download-links, .tab-bar {
+    border-bottom: 1px solid #888;
+  }
+  .tab-bar li {
+    border-bottom: 2px solid #aaa;
+  }
+  .tab-bar li:hover {
+    border-bottom: 2px solid #62b086;
+  }
+  code {
+    background-color: inherit;
+    color: white;
+  }
+  .twitter-timeline {
+    background-color: white;
+  }
+  .alert-warning {
+    color: #ffd804;
+    background-color: inherit;
+    border-color: #888;
+  }
+  pre {
+    background-color: #404040;
+    color: #d0d0d0;
+  }
+  .form-control {
+    background-color: inherit;
+    color: white;
+  }
+  select {
+    /* from https://github.com/kognise/water.css */
+    background: #222 url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='63' width='117' fill='%23efefef'%3E%3Cpath d='M115 2c-1-2-4-2-5 0L59 53 7 2a4 4 0 00-5 5l54 54 2 2 3-2 54-54c2-1 2-4 0-5z'/%3E%3C/svg%3E") calc(100% - 1em) 50%/1em no-repeat !important;
+    appearance: none;
+    -webkit-appearance: none;
+    padding-right: 3em !important;
+  }
+  select::-ms-expand {
+    display:none;
+  }
+  .nav li:hover {
+    background-color: #222;
+  }
+  .inline-download-links .label-default, .inline-download-links .label-warning {
+    background-color: inherit;
+  }
+  .inline-download-links .label-default {
+    border: 1px solid;
+    color: #009fff;
+  }
+  .inline-download-links .label-warning {
+    border: 1px solid;
+    color: #ffd804;
+  }
+  .navbar {
+    background-color: #295340;
+  }
+}