eddiesr93 opened a new pull request, #70203: URL: https://github.com/apache/airflow/pull/70203
In dark mode the Dag pause toggle is hard to make out: its off-state track uses `bg.emphasized`, which in this palette lands within 0.05 oklch lightness of the page background (0.08 in light mode), so only the white thumb reads and the pill has no visible edge. This gives the switch control a 1px inset ring so the shape is legible in both modes. ### Why an inset shadow and not a border Two earlier attempts, #67406 and #69159, added a `border` to the control and were closed after review found the thumb was no longer centred and the horizontal layout shifted. That is unavoidable with a border: the thumb's size and its checked travel are both derived from `--switch-height` / `--switch-width`, so any box-model space the control takes shrinks the content box the thumb sits in while its translate distance stays the same. `box-shadow: inset` costs no layout space. The thumb also stays concentric with the track's end cap — both are centred on (8, 8), with radii 6.4 and 8. Measured in a running UI: | | control | thumb | thumb gap T / B / leading | |---|---|---|---| | `main` | 32×16 | 12.8×12.8 | 1.60 / 1.60 / 1.60 | | this PR | 32×16 | 12.8×12.8 | 1.60 / 1.60 / 1.60 | ### Before / after Dags list in dark mode, `breeze start-airflow --dev-mode`: **Before**  **After**  closes: #66759 --- ##### Was generative AI tooling used to co-author this PR? - [X] Yes — Claude Code (Opus 4.8) Generated-by: Claude Code (Opus 4.8) following [the guidelines](https://github.com/apache/airflow/blob/main/contributing-docs/05_pull_requests.rst#gen-ai-assisted-contributions) --- Drafted-by: Claude Code (Opus 4.8); reviewed by @eddiesr93 before posting -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected]
