Merge pull request #2177 from strictdoc-project/mettta/ui_updates

export/html: Update base.css

Author: mettta

strictdoc/export/html/_static/base.css

@@ -17,8 +17,6 @@
   --color-highlight: rgb(255, 255, 200);
   --color-highlight-secondary: rgb(230, 236, 242);
 
-  /* --color-bg-secondary: rgb(0 0 0 / 1%); */
-
   --color-fg-secondary: rgba(0, 0, 0, .5);
   --color-bg-secondary: rgba(0, 0, 0, .025);
 
@@ -27,13 +25,24 @@
 
   --color-bg-ui: #282c42;
 
+  --color-red: rgb(200, 0, 0);
+  --color-blue: rgb(50, 100, 200);
+  --color-green: rgb(0, 100, 100);
+
+  --color-danger: var(--color-red);
+  --color-cancel: var(--color-fg-secondary);
+  --color-submit: var(--color-action);
+
   --color-link: var(--color-fg-secondary);
   --color-action: var(--color-fg-accent);
   --color-hover: var(--color-fg-contrast);
 
   --color-border: rgba(0,0,0,.1);
   --color-placeholder: rgba(0,0,0,.25);
 
+  --base-border: 1px solid var(--color-border);
+  --code-border-color: var(--color-border);
+
   --scrollbarBG: transparent;
   --thumbBG: rgba(0,0,0,.05);
 
@@ -42,11 +51,22 @@
   --base-font-size: calc(var(--base-rhythm)*2);
   --base-line-height: 1.6;
 
-  --font-size: 16px;
+  --font-size: var(--base-font-size);
+
   --font-size-l: 1.25rem;
   --font-size-sm: 0.8125rem;
   --font-size-xsm: 0.75rem;
   --font-size-xxsm: 11px;
+  --code-font-size: .85em;
+
+  --base-font-family: 'Noto Sans', sans-serif;
+  --code-font-family: 'Noto Sans Mono', consolas, monaco, monospace;
+  /*
+    DEV NOTE: To use system fonts,
+    uncomment the following two variables, replacing the previous two:
+  */
+  /* --base-font-family: ui-sans-serif, system-ui, -apple-system, "system-ui", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif; */
+  /* --code-font-family: monospace; */
 
   --base-gap: calc(var(--base-rhythm)*6);
   --tree-gap: calc(var(--base-rhythm)*4);
@@ -61,23 +81,7 @@
 
   --traceability-arrow: 1.25rem;
 
-  --code-border-color: var(--color-border);
-  --base-font-family: 'Noto Sans', sans-serif;
-  --code-font-family: 'Noto Sans Mono', consolas, monaco, monospace;
-  --code-font-size: .85em;
-
   --card-width: 300px;
-
-  --base-border: 1px solid var(--color-border);
-
-  --color-red: rgb(200, 0, 0);
-  --color-blue: rgb(50, 100, 200);
-  --color-green: rgb(0, 100, 100);
-
-  --color-danger: var(--color-red);
-  --color-cancel: var(--color-fg-secondary);
-  --color-submit: var(--color-action);
-
 }
 
 body {