From 699a8e2d9e10267e932f836e9c0b0811785f5f46 Mon Sep 17 00:00:00 2001
From: Lars Eggert <lars@eggert.org>
Date: Tue, 24 Oct 2023 01:34:59 +0200
Subject: [PATCH] fix: Change some colors to make agenda tool work in dark mode
 (#6428)

This is not a proper fix. This tool doesn't bootstrap much and is
hence full of custom CSS. Really needs a redo.
---
 ietf/static/css/ietf.scss | 69 +++++++++++++++++++--------------------
 1 file changed, 34 insertions(+), 35 deletions(-)

diff --git a/ietf/static/css/ietf.scss b/ietf/static/css/ietf.scss
index 06a0de80b..a81a8440a 100644
--- a/ietf/static/css/ietf.scss
+++ b/ietf/static/css/ietf.scss
@@ -614,7 +614,7 @@ td.position-empty {
 }
 
 .edit-meeting-schedule .edit-grid .day-label .swap-days:hover {
-    color: #666;
+    color: var(--bs-secondary-color);
 }
 
 .edit-meeting-schedule #swap-days-modal .modal-body label {
@@ -646,15 +646,15 @@ td.position-empty {
 }
 
 .edit-meeting-schedule .edit-grid .time-header .time-label.would-violate-hint {
-    background-color: #ffe0e0;
-    outline: #ffe0e0 solid 0.4em;
+    background-color: var(--bs-danger-bg-subtle);
+    outline: var(--bs-danger-bg-subtle) solid 0.4em;
 }
 
 .edit-meeting-schedule .edit-grid .time-header .time-label span {
     display: inline-block;
     width: 100%;
     text-align: center;
-    color: #444444;
+    color: var(--bs-secondary-color);
 }
 
 .edit-meeting-schedule .edit-grid .timeslots {
@@ -666,7 +666,7 @@ td.position-empty {
 .edit-meeting-schedule .edit-grid .timeslot {
     position: relative;
     display: inline-block;
-    background-color: #f4f4f4;
+    background-color: var(--bs-secondary-bg);
     height: 100%;
     overflow: hidden;
 }
@@ -679,7 +679,7 @@ td.position-empty {
     width: 100%;
     align-items: center;
     justify-content: center;
-    color: #999;
+    color: var(--bs-tertiary-color);
 }
 
 .edit-meeting-schedule .edit-grid .timeslot .drop-target {
@@ -696,22 +696,22 @@ td.position-empty {
 }
 
 .edit-meeting-schedule .edit-grid .timeslot.overfull {
-    border-right: 0.3em dashed #f55000;
+    border-right: 0.3em dashed var(--bs-danger);
     /* cut-off illusion */
 }
 
 .edit-meeting-schedule .edit-grid .timeslot.would-violate-hint {
-    background-color: #ffe0e0;
-    outline: #ffe0e0 solid 0.4em;
+    background-color: var(--bs-danger-bg-subtle);
+    outline: var(--bs-danger-bg-subtle) solid 0.4em;
 }
 
 .edit-meeting-schedule .edit-grid .timeslot.would-violate-hint.dropping {
-    background-color: #ccb3b3;
+    background-color: var(--bs-danger);
 }
 
 .edit-meeting-schedule .constraints .encircled,
 .edit-meeting-schedule .formatted-constraints .encircled {
-    border: 1px solid #000;
+    border: 1px solid var( --bs-body-color);
     border-radius: 1em;
     padding: 0 0.3em;
     text-align: center;
@@ -724,7 +724,7 @@ td.position-empty {
 
 /* sessions */
 .edit-meeting-schedule .session {
-    background-color: #fff;
+    background-color: var(--bs-body-bg);
     margin: 0.2em;
     padding-right: 0.2em;
     padding-left: 0.5em;
@@ -736,15 +736,15 @@ td.position-empty {
 
 .edit-meeting-schedule .session.selected {
     cursor: grabbing;
-    outline: #0000ff solid 0.2em;
-    /* blue, width matches margin on .session */
+    outline: var(--bs-primary) solid 0.2em;
+    /* width matches margin on .session */
     z-index: 2;
     /* render above timeslot outlines */
 }
 
 .edit-meeting-schedule .session.other-session-selected {
-    outline: #00008b solid 0.2em;
-    /* darkblue, width matches margin on .session */
+    outline: var(--bs-info) solid 0.2em;
+    /* width matches margin on .session */
     z-index: 2;
     /* render above timeslot outlines */
 }
@@ -755,7 +755,7 @@ td.position-empty {
 
 .edit-meeting-schedule .session.readonly {
     cursor: default;
-    background-color: #ddd;
+    background-color: var(--bs-dark-bg-subtle);
 }
 
 .edit-meeting-schedule .session.hidden-parent * {
@@ -769,13 +769,12 @@ td.position-empty {
 }
 
 .edit-meeting-schedule .session.highlight {
-    outline-color: #ff8c00;
-    /* darkorange */
-    background-color: #f3f3f3;
+    outline-color: var(--bs-warning);
+    background-color: var(--bs-light);
 }
 
 .edit-meeting-schedule .session.would-violate-hint {
-    outline: 0.3em solid #F55000;
+    outline: 0.3em solid var(--bs-danger);
     z-index: 1;
     /* raise up so the outline is not overdrawn */
 }
@@ -797,7 +796,7 @@ td.position-empty {
 
 .edit-meeting-schedule .edit-grid,
 .edit-meeting-schedule .session {
-    font-family: arial, helvetica, sans-serif;
+    // font-family: arial, helvetica, sans-serif;
     font-size: 11px;
 }
 
@@ -868,9 +867,9 @@ td.position-empty {
     bottom: 0;
     left: 0;
     width: 100%;
-    border-top: 0.2em solid #ccc;
+    border-top: 0.2em solid var(--bs-border-color);
     margin-bottom: 2em;
-    background-color: #fff;
+    background-color: var(--bs-body-bg);
     opacity: 0.95;
     z-index: 5;
     /* raise above edit-grid items */
@@ -885,7 +884,7 @@ td.position-empty {
     min-height: 4em;
     max-height: 13em;
     overflow-y: auto;
-    background-color: #f4f4f4;
+    background-color: var(--bs-secondary-bg);
 }
 
 .edit-meeting-schedule .unassigned-sessions.dropping {
@@ -942,7 +941,7 @@ td.position-empty {
     font-weight: normal;
     margin-right: 1em;
     padding: 0 1em;
-    border: 0.1em solid #eee;
+    border: 0.1em solid var(--bs-border-color);
     cursor: pointer;
 }
 
@@ -1008,7 +1007,7 @@ td.position-empty {
 }
 
 .edit-meeting-timeslots-and-misc-sessions .room-row {
-    border-bottom: 1px solid #ccc;
+    border-bottom: 1px solid var(--bs-border-color);
     // height: 20px;
     display: flex;
     cursor: pointer;
@@ -1028,13 +1027,13 @@ td.position-empty {
 }
 
 .edit-meeting-timeslots-and-misc-sessions .timeline.hover {
-    background: radial-gradient(#999 1px, transparent 1px);
+    background: radial-gradient(var(--bs-tertiary-color) 1px, transparent 1px);
     background-size: 20px 20px;
 }
 
 .edit-meeting-timeslots-and-misc-sessions .timeline.selected.hover,
 .edit-meeting-timeslots-and-misc-sessions .timeline.selected {
-    background: radial-gradient(#999 2px, transparent 2px);
+    background: radial-gradient(var(--bs-tertiary-color) 2px, transparent 2px);
     background-size: 20px 20px;
 }
 
@@ -1050,8 +1049,8 @@ td.position-empty {
     white-space: nowrap;
     cursor: pointer;
     padding-left: 0.2em;
-    border-left: 1px solid #999;
-    border-right: 1px solid #999;
+    border-left: 1px solid var(--bs-border-color);
+    border-right: 1px solid var(--bs-border-color);
 }
 
 .edit-meeting-timeslots-and-misc-sessions .timeslot:hover {
@@ -1071,10 +1070,10 @@ td.position-empty {
     bottom: 0;
     left: 0;
     width: 100%;
-    border-top: 0.2em solid #ccc;
+    border-top: 0.2em solid var(--bs-border-color);
     padding-top: 0.2em;
     margin-bottom: 2em;
-    background-color: #fff;
+    background-color: var(--bs-body-bg);
     opacity: 0.95;
 }
 
@@ -1122,7 +1121,7 @@ td.position-empty {
 }
 
 .timeslot-edit .tstable div.timeslot {
-    border: #000000 solid 1px;
+    border: var(--bs-body-color) solid 1px;
     border-radius: 0.5em;
     padding: 0.5em;
 }
@@ -1152,7 +1151,7 @@ td.position-empty {
 }
 
 .timeslot-edit .tstable .tstype_unavail {
-    background-color: #666;
+    background-color: var(--bs-secondary-color);
 }
 
 .timeslot-edit .official-use-warning {