Skip to content

Commit 38495ca

Browse files
wildleo91claude
wildleo91
and
claude
committed
refactor(css): flatten 13 .wl-dark X selectors to dark-only base rules (build 638)
Build 637 made wl-dark unconditional (force dark-only theme) but left 13 .wl-dark X selectors in whitelist_manager.css as harmless redundancy. Build 638 flattens them: for each pair X { ...light... } + .wl-dark X { ...dark... }, the dark values are merged into the base rule and the .wl-dark X block is deleted. Net change: 13 fewer rules, ~50 fewer CSS lines, single source of truth per element. wl_ui.js :: detectDarkTheme() still applies wl-dark to <body> as a no-op marker for any external code that might key off the class — no in-app CSS rule depends on it anymore. Verified all 13 clusters against build 637 dark values via browser DOM-injection tests + getComputedStyle snapshots. WM, Control Panel, and Audit Trail render identically to build 637. Zero visual regressions. Elements flattened: .wl-col-check input[type="checkbox"], .wl-cell-match, .wl-cell-edited, .wl-bulk-edit-bar, tr.wl-pending-approval (+ :hover, + .wl-input), th.wl-pending-approval-header, .wl-table.wl-pending-approval-table, .wl-approval-self-note, .wl-approval-bar, .wl-approval-item + .wl-approval-item, .wl-addition-preview. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
1 parent 988aa5a commit 38495ca

4 files changed

Lines changed: 75 additions & 70 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,59 @@ Detailed per-round entries below.
6464

6565
---
6666

67+
## Unreleased — 2026-05-01 (build 638, flatten redundant `.wl-dark X` selectors)
68+
69+
### Cleanup follow-up: zero `.wl-dark X` selectors remain in CSS
70+
71+
Build 637 previously collapsed `:root` light + `body.wl-dark` dark blocks
72+
to a single `:root`, but left 13 `.wl-dark X` selectors throughout
73+
`whitelist_manager.css` as harmless redundancy (they always match
74+
because `wl-dark` is unconditionally applied). Build 638 flattens
75+
these into their corresponding base rules.
76+
77+
For each pair `X { ...light values... }` + `.wl-dark X { ...dark
78+
values... }`, the dark values were merged into the base rule and
79+
the `.wl-dark X` block deleted. Net: 13 fewer rules, ~50 fewer
80+
CSS lines, single source of truth per element.
81+
82+
Specific elements flattened (all visually verified post-flatten
83+
against expected dark values):
84+
85+
- `.wl-col-check input[type="checkbox"]` (`color-scheme: dark`)
86+
- `.wl-cell-match` (bg `#3b3000`, border `#f9a825`)
87+
- `.wl-cell-edited` (bg `#3e2723`)
88+
- `.wl-bulk-edit-bar` (bg `#1a237e30`, border `#3949ab`)
89+
- `tr.wl-pending-approval` (bg `#3e2200`)
90+
- `tr.wl-pending-approval:hover` (bg `#4a2a00`)
91+
- `tr.wl-pending-approval .wl-input` (bg `#3b2000`)
92+
- `th.wl-pending-approval-header` (bg `#3e2200`, color `#ffd699`)
93+
- `.wl-table.wl-pending-approval-table` (outline `#e65100` 3px solid)
94+
- `.wl-approval-self-note` (color `#ffb74d`)
95+
- `.wl-approval-bar` (bg `#3e2723`, border `#e65100`)
96+
- `.wl-approval-item + .wl-approval-item` (border-top `#e65100`)
97+
- `.wl-addition-preview` (bg `#2a2a2a`)
98+
99+
`wl_ui.js :: detectDarkTheme()` still applies `wl-dark` to `<body>`
100+
unconditionally — kept as a no-op marker for any external code
101+
(Splunk plugins, future debug hooks) that might key off the class.
102+
No in-app CSS rule depends on the class anymore.
103+
104+
### Verification
105+
106+
Browser-tested all 13 clusters via DOM injection of test elements
107+
and `getComputedStyle()` snapshots. Every property matches the
108+
build-637 dark value exactly. Whitelist Manager, Control Panel,
109+
and Audit Trail all render identically to the previously-shipped build 637.
110+
111+
### Migration / rollback
112+
113+
Per-cluster reversion is straightforward: re-introduce the `.wl-dark X`
114+
override block and revert the base rule's properties to the
115+
pre-flatten light values. Files affected: `whitelist_manager.css`
116+
only.
117+
118+
---
119+
67120
## Unreleased — 2026-05-01 (build 637, dark-only theme + final palette unification)
68121

69122
### Theme: dark-only (light-theme support removed)

‎appserver/static/whitelist_manager.css‎

Lines changed: 20 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,13 @@
99
* re-introduce a `:root` light block and a `body.wl-dark` override
1010
* block, then re-enable brightness-based detection in `wl_ui.js`.
1111
*
12-
* Existing `.wl-dark X` selectors throughout this file are left in
13-
* place because they continue to match (JS always applies the
14-
* `wl-dark` class to body). They're functionally redundant and can
15-
* be flattened to plain `X` selectors in a follow-up cleanup pass.
12+
* Build 637 follow-up: flattened the 13 `.wl-dark X` selectors to
13+
* plain `X` selectors. The dark values were merged into the base
14+
* rules; the redundant `.wl-dark`-prefixed override blocks were
15+
* deleted. `wl_ui.js :: detectDarkTheme()` still applies `wl-dark`
16+
* to <body> for any external code that might key off the class
17+
* (Splunk plugins, future debugging hooks), but no in-app CSS rule
18+
* depends on the class anymore.
1619
*/
1720

1821

@@ -333,9 +336,6 @@ td.wl-col-rownum {
333336
height: 16px;
334337
cursor: pointer;
335338
accent-color: #5cc05c;
336-
color-scheme: light;
337-
}
338-
.wl-dark .wl-col-check input[type="checkbox"] {
339339
color-scheme: dark;
340340
}
341341

@@ -931,11 +931,6 @@ body.wl-resizing * {
931931

932932
/* Matching cells during search — highlighted border + subtle background */
933933
.wl-cell-match {
934-
border-color: #f9a825 !important;
935-
background-color: #fff9c4 !important;
936-
}
937-
938-
.wl-dark .wl-cell-match {
939934
border-color: #f9a825 !important;
940935
background-color: #3b3000 !important;
941936
}
@@ -1115,8 +1110,8 @@ body.wl-resizing * {
11151110
align-items: center;
11161111
gap: 8px;
11171112
padding: 6px 10px;
1118-
background: var(--wl-info-bg);
1119-
border: 1px solid var(--wl-info-border);
1113+
background: #1a237e30;
1114+
border: 1px solid #3949ab;
11201115
border-radius: 4px;
11211116
margin-bottom: 6px;
11221117
font-size: 13px;
@@ -1132,18 +1127,9 @@ body.wl-resizing * {
11321127
}
11331128

11341129
.wl-cell-edited {
1135-
background: #fff8e1 !important;
1136-
}
1137-
1138-
.wl-dark .wl-cell-edited {
11391130
background: #3e2723 !important;
11401131
}
11411132

1142-
body.wl-dark .wl-bulk-edit-bar {
1143-
background: #1a237e30;
1144-
border-color: #3949ab;
1145-
}
1146-
11471133
/* ── Drag and Drop ────────────────────────────────────────────────── */
11481134

11491135
.wl-row-drag-handle {
@@ -1214,46 +1200,25 @@ body.wl-dragging-active {
12141200
/* ── Pending Approval Highlights (Orange) ─────────────────────────── */
12151201

12161202
tr.wl-pending-approval {
1217-
background-color: #fff3e0 !important;
1218-
}
1219-
1220-
tr.wl-pending-approval:hover {
1221-
background-color: #ffe0b2 !important;
1222-
}
1223-
1224-
tr.wl-pending-approval .wl-input {
1225-
background-color: #fff8e1;
1226-
}
1227-
1228-
th.wl-pending-approval-header {
1229-
background-color: #fff3e0 !important;
1230-
color: #333 !important;
1231-
}
1232-
1233-
.wl-table.wl-pending-approval-table {
1234-
outline: 3px solid #ff9800;
1235-
outline-offset: 2px;
1236-
}
1237-
1238-
.wl-dark tr.wl-pending-approval {
12391203
background-color: #3e2200 !important;
12401204
}
12411205

1242-
.wl-dark tr.wl-pending-approval:hover {
1206+
tr.wl-pending-approval:hover {
12431207
background-color: #4a2a00 !important;
12441208
}
12451209

1246-
.wl-dark tr.wl-pending-approval .wl-input {
1210+
tr.wl-pending-approval .wl-input {
12471211
background-color: #3b2000;
12481212
}
12491213

1250-
.wl-dark th.wl-pending-approval-header {
1214+
th.wl-pending-approval-header {
12511215
background-color: #3e2200 !important;
12521216
color: #ffd699 !important;
12531217
}
12541218

1255-
.wl-dark .wl-table.wl-pending-approval-table {
1256-
outline-color: #e65100;
1219+
.wl-table.wl-pending-approval-table {
1220+
outline: 3px solid #e65100;
1221+
outline-offset: 2px;
12571222
}
12581223

12591224
/* ── Locked button (pending approval) ────────────────────────────── */
@@ -1370,8 +1335,8 @@ th.wl-pending-approval-header {
13701335
.wl-approval-bar {
13711336
margin: 8px 0;
13721337
padding: 10px 12px;
1373-
background: #fff8e1;
1374-
border: 1px solid #ffe082;
1338+
background: #3e2723;
1339+
border: 1px solid #e65100;
13751340
border-radius: 4px;
13761341
}
13771342
.wl-approval-item {
@@ -1381,7 +1346,7 @@ th.wl-pending-approval-header {
13811346
padding: 6px 0;
13821347
}
13831348
.wl-approval-item + .wl-approval-item {
1384-
border-top: 1px solid #ffe082;
1349+
border-top: 1px solid #e65100;
13851350
margin-top: 6px;
13861351
padding-top: 10px;
13871352
}
@@ -1398,18 +1363,8 @@ th.wl-pending-approval-header {
13981363
}
13991364
.wl-approval-self-note {
14001365
font-style: italic;
1401-
color: #e65100;
1402-
white-space: nowrap;
1403-
}
1404-
.wl-dark .wl-approval-self-note {
14051366
color: #ffb74d;
1406-
}
1407-
.wl-dark .wl-approval-bar {
1408-
background: #3e2723;
1409-
border-color: #e65100;
1410-
}
1411-
.wl-dark .wl-approval-item + .wl-approval-item {
1412-
border-top-color: #e65100;
1367+
white-space: nowrap;
14131368
}
14141369

14151370
/* ── Control Panel tab bar ────────────────────────────────────────── */
@@ -1450,7 +1405,7 @@ th.wl-pending-approval-header {
14501405
}
14511406

14521407
.wl-addition-preview {
1453-
background: var(--wl-bg-alt, #f8f9fa);
1408+
background: #2a2a2a;
14541409
border: 2px solid var(--wl-pending-border, #e67e22);
14551410
border-radius: 6px;
14561411
padding: 12px;
@@ -1462,9 +1417,6 @@ th.wl-pending-approval-header {
14621417
text-overflow: ellipsis;
14631418
white-space: nowrap;
14641419
}
1465-
.wl-dark .wl-addition-preview {
1466-
background: #2a2a2a;
1467-
}
14681420

14691421
/* ── CSV Import Section ───────────────────────────────────────── */
14701422
.wl-import-section {

‎appserver/static/whitelist_manager.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
// disk cache. Splunk serves /static/@<server-hash>/... with Cache-Control:
1212
// public, max-age=31536000; without urlArgs, bumped build numbers don't force
1313
// a re-fetch and clients run stale JS until they hard-refresh.
14-
require.config({ urlArgs: "_b=637" });
14+
require.config({ urlArgs: "_b=638" });
1515
require([
1616
"jquery",
1717
"underscore",

‎default/app.conf‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
[install]
77
is_configured = false
8-
build = 637
8+
build = 638
99

1010
[launcher]
1111
author = Security Engineering

0 commit comments

Comments
 (0)