Fix dark mode

Author: Bellangelo

scripts/md2html/main.css

@@ -73,27 +73,58 @@ a.bibref {
 }
 
 @media (prefers-color-scheme: dark) {
-    pre,
-    table tr:nth-child(2n),
-    table tr {
+    body.darkmode {
+        --toclink-underline: #6a9000;
+        --toclink-visited-underline: #fff;
+    }
+
+    body.darkmode a,
+    body.darkmode .tocxref,
+    body.darkmode .u-url {
+        color: #6a9000;
+    }
+
+    body.darkmode code {
+        color: #e66c33;
+    }
+
+    body.darkmode:not(.toc-inline) #toc h2,
+    body.darkmode h1,
+    body.darkmode h2,
+    body.darkmode h3,
+    body.darkmode h4,
+    body.darkmode h5,
+    body.darkmode h6,
+    body.darkmode #title,
+    body.darkmode #subtitle,
+    body.darkmode .toc-inline,
+    body.darkmode .dt-published {
+        color: #7bb01c;
+    }
+
+    body.darkmode pre,
+    body.darkmode table tr:nth-child(2n),
+    body.darkmode table tr {
         background-color: #1e1e1e !important;
         color: #dcdcdc;
     }
 
-    img {
+    body.darkmode img {
         background: transparent;
     }
 
-    .logo img {
+    body.darkmode .logo img {
         display: none;
     }
 
-    .logo::before {
+    body.darkmode .logo::before {
         content: "";
         display: inline-block;
         height: 48px;
-        width: 200px;
-        background: url("https://raw.githubusercontent.com/OAI/OpenAPI-Style-Guide/refs/heads/main/graphics/bitmap/OpenAPI_Logo_White.png") no-repeat center / contain;
+        width: 175px;
+        background: url("https://raw.githubusercontent.com/OAI/OpenAPI-Style-Guide/refs/heads/main/graphics/bitmap/OpenAPI_Logo_Pantone.png") no-repeat center / contain;
         vertical-align: middle;
     }
+}
+
 }

scripts/md2html/md2html.js

@@ -129,6 +129,7 @@ function preface(title,options) {
     preface += '<meta name="description" content="The OpenAPI Specification (OAS) defines a standard, programming language-agnostic interface description for HTTP APIs.">';
 
     // ReSpec
+    preface += '<meta name="color-scheme" content="light dark">';
     preface += '<script src="../js/respec-w3c.js" class="remove"></script>';
     preface += `<script class="remove">var respecConfig = ${JSON.stringify(respec)};</script>`;
     try {
@@ -149,7 +150,6 @@ function preface(title,options) {
     preface += '<h2>Status of This Document</h2>';
     preface += 'The source-of-truth for this specification is the HTML file referenced above as <em>This version</em>.';
     preface += '</section>';
-    preface += '<link rel="stylesheet" type="text/css" href="https://www.w3.org/StyleSheets/TR/2021/dark.css" media="(prefers-color-scheme: dark)">';
 
     return preface;
 }