Browse Source

LibWebView: Use custom properties for syntax-highlighting colors

Sam Atkins 9 months ago
parent
commit
66c39f3da4
1 changed files with 35 additions and 37 deletions
  1. 35 37
      Userland/Libraries/LibWebView/SourceHighlighter.h

+ 35 - 37
Userland/Libraries/LibWebView/SourceHighlighter.h

@@ -71,55 +71,53 @@ private:
 String highlight_source(URL::URL const&, StringView);
 
 constexpr inline StringView HTML_HIGHLIGHTER_STYLE = R"~~~(
-    .html {
-        font-size: 10pt;
-        font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-    }
-
-    .tag {
-        font-weight: 600;
-    }
-
     @media (prefers-color-scheme: dark) {
         /* FIXME: We should be able to remove the HTML style when "color-scheme" is supported */
         html {
             background-color: rgb(30, 30, 30);
             color: white;
         }
-        .comment {
-            color: lightgreen;
-        }
-        .tag {
-            color: orangered;
-        }
-        .attribute-name {
-            color: orange;
-        }
-        .attribute-value {
-            color: deepskyblue;
-        }
-        .internal {
-            color: darkgrey;
+
+        :root {
+            --comment-color: lightgreen;
+            --keyword-color: orangered;
+            --name-color: orange;
+            --value-color: deepskyblue;
+            --internal-color: darkgrey;
         }
     }
 
     @media (prefers-color-scheme: light) {
-        .comment {
-            color: green;
-        }
-        .tag {
-            color: red;
-        }
-        .attribute-name {
-            color: darkorange;
-        }
-        .attribute-value {
-            color: blue;
-        }
-        .internal {
-            color: dimgray;
+        :root {
+            --comment-color: green;
+            --keyword-color: red;
+            --name-color: darkorange;
+            --value-color: blue;
+            --internal-color: dimgrey;
         }
     }
+
+    .html {
+        font-size: 10pt;
+        font-family: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+    }
+
+    .tag {
+        font-weight: 600;
+        color: var(--keyword-color);
+    }
+    .comment {
+        color: var(--comment-color);
+    }
+    .attribute-name {
+        color: var(--name-color);
+    }
+    .attribute-value {
+        color: var(--value-color);
+    }
+    .internal {
+        color: var(--internal-color);
+    }
 )~~~"sv;
 
 }