added css/html for inverse logo for darkmode

index.md

@@ -5,7 +5,9 @@
 <a href="/colophon.html">colophon</a>
 </p>
 
-<img class="mt4" src="vi-sw.png">
+<div class="logo-container">
+  <img id="logo" class="mt4" src="vi-sw.png" alt="Logo">
+</div>
 
 _Why? [vi](https://en.wikipedia.org/wiki/Vi) is the **de facto** standard
 text editor in any Unix-like operating system._

style.css

@@ -241,10 +241,23 @@ h2 { font-size: 1.25rem; }
 
 .cut *, .cut *::before { color: #ccc; background-color: #f4f4f4; }
 
+.logo-container {
+  width: 150px; 
+  height: 150px;
+}
+
+.logo-container img {
+  width: 75%;
+  height: 75%;
+}
+
 @media (prefers-color-scheme: dark) {
   a, a:link, a:visited { color: #ffe489; }
   body, html { background-color: #111111; color: #888888; }
   pre { background-color: #111111; color: #aaaaaa; }
   .clean { background-color: #111111; color: #aaaaaa; }
+  .logo-container img {
+    filter: invert(100%); 
+  }
 }