Full document, spreadsheet, slideshow, and diagram tooling
Merge pull request 'fix: force-suppress all focus outlines with !important' (#38) from fix/focus-color-teal into main
+8
-6
+8
-6
src/css/app.css
+8
-6
src/css/app.css
···
1432
1432
transform: rotate(45deg);
1433
1433
}
1434
1434
.tiptap ul[data-type="taskList"] li > label input[type="checkbox"]:focus-visible {
1435
-
outline: 2px solid var(--color-focus);
1436
-
outline-offset: 1px;
1435
+
outline: none;
1437
1436
}
1438
1437
/* Checked task items: muted text */
1439
1438
.tiptap ul[data-type="taskList"] li[data-checked="true"] > div {
···
3458
3457
3459
3458
.skip-link:focus {
3460
3459
top: 0;
3461
-
outline: 2px solid var(--color-accent);
3462
-
outline-offset: 2px;
3460
+
outline: none;
3463
3461
}
3464
3462
3465
3463
/* ========================================================
···
3467
3465
Only show on keyboard navigation, not mouse clicks.
3468
3466
======================================================== */
3469
3467
3470
-
/* Suppress all focus outlines by default — clean UI for mouse users */
3468
+
/* Suppress all focus outlines by default — clean UI for mouse users.
3469
+
!important overrides higher-specificity rules from individual components. */
3471
3470
*:focus, *:focus-visible {
3472
-
outline: none;
3471
+
outline: none !important;
3473
3472
}
3473
+
/* Allow specific non-focus outlines (cell selection, validation) to work */
3474
+
.sheet-grid td.selected { outline: 2px solid var(--color-teal) !important; outline-offset: -1px; }
3475
+
.sheet-grid td.validation-invalid { outline: 2px solid var(--color-danger) !important; outline-offset: -2px; }
3474
3476
3475
3477
/* Opt-in accessibility focus rings via data attribute on html element */
3476
3478
[data-a11y-focus] *:focus-visible {