(generator) Updates

Author: JustDeveloper1

src/documentation/index.js

@@ -280,7 +280,9 @@ lighthighlight.forEach(rule => {
     for (const [keyy, valme] of Object.entries(rule.properties)) {
         props.push(`${keyy}:${valme}`);
     }
-    CSSHIGHLIGHT += `${rule.selectors.map(s => `.${cssclass.l} ${s}`).join(',')}{${props.join(';')}}`;
+    const outstr = (addclass) => `${rule.selectors.map(s => `.${addclass} ${s}`).join(',')}{${props.join(';')}}`;
+    CSSHIGHLIGHT += outstr(cssclass.l);
+    CSSHIGHLIGHT += `@media (prefers-color-scheme: light) {${outstr(cssclass.a)}}`;
 });
 
 const charset = docsConfig ? docsConfig.charset || template.charset : template.charset;

src/documentation/templates/base.css

@@ -47,6 +47,15 @@
     --wt: #ffb00080;
     --wb: #ffb0002b;
 }
+@media (prefers-color-scheme: light) {
+    .a {
+        --bg: #f0f0f0;
+        --cl: #121212;
+        --md: #00000026;
+        --wt: #ffb00080;
+        --wb: #ffb0002b;
+    }
+}
 .stb {
     --sb: 0px;
 }
@@ -127,6 +136,12 @@ button, input {
     background-color: var(--md);
     color: var(--cl);
 }
+@media (prefers-color-scheme: light) {
+    .a button, .a input {
+        background-color: var(--md);
+        color: var(--cl);
+    }
+}
 button:hover, input:hover {
     opacity: 0.85;
 }
@@ -378,6 +393,15 @@ body.navbar-invert .navbar.scroll, .l .navbar .links a:hover {
     filter: hue-rotate(1deg);
     -webkit-filter: hue-rotate(1deg);
 }
+@media (prefers-color-scheme: light) {
+    .a .navbar .links a#ext:after {
+        opacity: 1;
+    }
+    .a .navbar .links a:hover {
+        filter: hue-rotate(1deg);
+        -webkit-filter: hue-rotate(1deg);
+    }
+}
 .navbar .heading:not(:has(span)) {
     width: auto;
     height: auto;
@@ -1065,6 +1089,12 @@ input[type="checkbox"] {
     background: #e5e5e5;
     color: #000000;
 }
+@media (prefers-color-scheme: light) {
+    .a .code, .a .code code, .a .code * {
+        background: #e5e5e5;
+        color: #000000;
+    }
+}
 
 html:before, html:after, body:before, body:after {
     content: none !important;

src/documentation/templates/buttons.css

@@ -66,6 +66,11 @@
 .l .next button:hover {
     background-color: #00000020;
 }
+@media (prefers-color-scheme: light) {
+    .a .next button:hover {
+        background-color: #00000020;
+    }
+}
 .next button small, .next button span {
     display: block !important;
     white-space: nowrap;