fix: More darkmode fixes

ietf/static/css/custom-bs-import.scss

@@ -0,0 +1,55 @@
+@import "bootstrap/scss/functions";
+
+// Enable negative margin classes.
+$enable-negative-margins: true;
+
+// Don't add carets to dropdowns by default.
+// $enable-caret: false;
+
+$popover-max-width: 100%;
+
+// Override default fonts
+
+$font-family-sans-serif: "Inter",
+system-ui,
+-apple-system,
+"Segoe UI",
+Roboto,
+"Helvetica Neue",
+"Noto Sans",
+"Liberation Sans",
+Arial,
+sans-serif,
+"Apple Color Emoji",
+"Segoe UI Emoji",
+"Segoe UI Symbol",
+"Noto Color Emoji";
+$font-family-monospace: "Noto Sans Mono",
+SFMono-Regular,
+Menlo,
+Monaco,
+Consolas,
+"Liberation Mono",
+"Courier New",
+monospace;
+
+// Enable color modes
+$color-mode-type: data;
+
+@import "bootstrap/scss/variables";
+@import "bootstrap/scss/variables-dark";
+
+$h1-font-size: $font-size-base * 2.2;
+$h2-font-size: $font-size-base * 1.8;
+$h3-font-size: $font-size-base * 1.6;
+$h4-font-size: $font-size-base * 1.4;
+$h5-font-size: $font-size-base * 1.2;
+$h6-font-size: $font-size-base;
+
+@import "bootstrap/scss/maps";
+@import "bootstrap/scss/mixins";
+@import "bootstrap/scss/utilities";
+@import "bootstrap/scss/root";
+
+
+

ietf/static/css/datepicker.scss

@@ -1,13 +1,4 @@
-@import "bootstrap/scss/functions";
-
-// Enable color modes
-$color-mode-type: data;
-
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/variables-dark";
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/root";
+@import "custom-bs-import";
 
 // FIXME: color.scale doesn't seem to work with CSS variables, so avoid those:`
 $dp-cell-focus-background-color: $dropdown-link-hover-bg !default;

ietf/static/css/document_html.scss

@@ -1,41 +1,9 @@
 @use "sass:map";
 
-$font-family-sans-serif: "Inter",
-system-ui,
--apple-system,
-"Segoe UI",
-Roboto,
-"Helvetica Neue",
-"Noto Sans",
-"Liberation Sans",
-Arial,
-sans-serif,
-"Apple Color Emoji",
-"Segoe UI Emoji",
-"Segoe UI Symbol",
-"Noto Color Emoji";
-$font-family-monospace: "Noto Sans Mono",
-SFMono-Regular,
-Menlo,
-Monaco,
-Consolas,
-"Liberation Mono",
-"Courier New",
-monospace;
-
-@import "bootstrap/scss/functions";
-
-// Enable color modes
-$color-mode-type: data;
-
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/variables-dark";
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/utilities";
-@import "bootstrap/scss/root";
+@import "custom-bs-import";
 
 // Layout & components
+// Only import what we need:
 @import "bootstrap/scss/reboot";
 @import "bootstrap/scss/type";
 // @import "bootstrap/scss/images";

ietf/static/css/document_html_txt.scss

@@ -69,7 +69,7 @@ figure {
 blockquote {
   @include margin-paragraph; // margin: var(--paragraph);
   padding-left: calc(2ch - 2px);
-  border-left: 2px solid darkgrey;
+  border-left: 2px solid var(--bs-border-color);
 }
 
 /* Header junk */
@@ -374,7 +374,7 @@ thead, tfoot {
   border-bottom-style: double;
 }
 td, th {
-  border: 1px solid inherit;
+  border: 1px solid var(--bs-border-color);
   // padding: var(--half-line) 1ch;
   padding-top: var(--half-line);
   padding-right: 1ch;

ietf/static/css/highcharts.scss

@@ -0,0 +1 @@
+@import "npm:highcharts/css/highcharts.css";

ietf/static/css/ietf.scss

@@ -1,61 +1,9 @@
 @use "sass:map";
 
-@import "bootstrap/scss/functions";
-
-// Enable negative margin classes.
-$enable-negative-margins: true;
-
-// Don't add carets to dropdowns by default.
-// $enable-caret: false;
-
-$popover-max-width: 100%;
-
-// Override default fonts
-
-$font-family-sans-serif: "Inter",
-system-ui,
--apple-system,
-"Segoe UI",
-Roboto,
-"Helvetica Neue",
-"Noto Sans",
-"Liberation Sans",
-Arial,
-sans-serif,
-"Apple Color Emoji",
-"Segoe UI Emoji",
-"Segoe UI Symbol",
-"Noto Color Emoji";
-$font-family-monospace: "Noto Sans Mono",
-SFMono-Regular,
-Menlo,
-Monaco,
-Consolas,
-"Liberation Mono",
-"Courier New",
-monospace;
-
-// Enable color modes
-$color-mode-type: data;
-
-// Only import what we need:
-
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/variables-dark";
-
-$h1-font-size: $font-size-base * 2.2;
-$h2-font-size: $font-size-base * 1.8;
-$h3-font-size: $font-size-base * 1.6;
-$h4-font-size: $font-size-base * 1.4;
-$h5-font-size: $font-size-base * 1.2;
-$h6-font-size: $font-size-base;
-
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/utilities";
-@import "bootstrap/scss/root";
+@import "custom-bs-import";
 
 // Layout & components
+// Only import what we need:
 @import "bootstrap/scss/reboot";
 @import "bootstrap/scss/type";
 @import "bootstrap/scss/images";
@@ -205,8 +153,8 @@ pre {
         --#{$prefix}dropdown-divider-bg: #{$dropdown-divider-bg};
         --#{$prefix}dropdown-divider-margin-y: #{$dropdown-divider-margin-y};
         --#{$prefix}dropdown-box-shadow: #{$dropdown-box-shadow};
-        --#{$prefix}dropdown-link-color: #{$dropdown-link-color};
-        --#{$prefix}dropdown-link-hover-color: #{$dropdown-link-hover-color};
+        --#{$prefix}dropdown-link-color: #{$nav-link-color};
+        --#{$prefix}dropdown-link-hover-color: #{$nav-link-hover-color};
         --#{$prefix}dropdown-link-hover-bg: #{$dropdown-link-hover-bg};
         --#{$prefix}dropdown-link-active-color: #{$dropdown-link-active-color};
         --#{$prefix}dropdown-link-active-bg: #{$dropdown-link-active-bg};
@@ -351,7 +299,7 @@ th,
     .axis path,
     .axis line {
         fill: none;
-        stroke: black;
+        stroke: var(--bs-body-color);
     }
 
     .axis.y path,
@@ -368,7 +316,7 @@ th,
     }
 
     .bar text {
-        fill: black;
+        fill: var(--bs-body-color);
         dominant-baseline: central;
         pointer-events: none;
     }
@@ -407,7 +355,7 @@ th,
 }
 
 .ballot-icon table .my {
-    border: calc(2 * $table-border-width) solid #000;
+    border: calc(2 * $table-border-width) solid var(--bs-emphasis-color);
 }
 
 // See https://getbootstrap.com/docs/5.1/customize/color/#all-colors

ietf/static/css/list.scss

@@ -1,11 +1,4 @@
-// Import bootstrap helpers
-@import "bootstrap/scss/functions";
-
-// Enable color modes
-$color-mode-type: data;
-
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/variables-dark";
+@import "custom-bs-import";
 
 table .sort {
     cursor: pointer;

ietf/static/css/select2.scss

@@ -1,13 +1,4 @@
-@import "bootstrap/scss/functions";
-
-// Enable color modes
-$color-mode-type: data;
-
-@import "bootstrap/scss/variables";
-@import "bootstrap/scss/variables-dark";
-@import "bootstrap/scss/maps";
-@import "bootstrap/scss/mixins";
-@import "bootstrap/scss/root";
+@import "custom-bs-import";
 
 // FIXME: bs-5.3.0 workaround from https://github.com/apalfrey/select2-bootstrap-5-theme/issues/75#issuecomment-1573265695
 $s2bs5-border-color: $border-color;

ietf/static/js/highcharts.js

@@ -13,17 +13,9 @@ Highcharts_Accessibility(Highcharts);
 Highcharts_Sunburst(Highcharts);
 
 Highcharts.setOptions({
-    // use colors from https://colorbrewer2.org/#type=qualitative&scheme=Paired&n=12
-    colors: ['#a6cee3', '#1f78b4', '#b2df8a', '#33a02c', '#fb9a99',
-        '#e31a1c', '#fdbf6f', '#ff7f00', '#cab2d6', '#6a3d9a',
-        '#ffff99', '#b15928'
-    ],
     chart: {
         height: "100%",
-        style: {
-            fontFamily: getComputedStyle(document.body)
-                .getPropertyValue('--bs-body-font-family')
-        }
+        styledMode: true,
     },
     credits: {
         enabled: false

ietf/static/js/highstock.js

@@ -10,4 +10,13 @@ Highcharts_Offline_Exporting(Highcharts);
 Highcharts_Export_Data(Highcharts);
 Highcharts_Accessibility(Highcharts);
 
+Highcharts.setOptions({
+    chart: {
+        styledMode: true,
+    },
+    credits: {
+        enabled: false
+    },
+});
+
 window.Highcharts = Highcharts;