Full document, spreadsheet, slideshow, and diagram tooling
Merge pull request 'fix: suppress focus outline on mouse clicks' (#35) from fix/focus-outline into main
+13
-10
+13
-10
src/css/app.css
+13
-10
src/css/app.css
···
3464
3464
3465
3465
/* ========================================================
3466
3466
Accessibility — Focus Visible Outlines
3467
+
Only show on keyboard navigation, not mouse clicks.
3467
3468
======================================================== */
3468
3469
3470
+
/* Suppress all default focus outlines */
3471
+
*:focus {
3472
+
outline: none;
3473
+
}
3474
+
3475
+
/* Show outline only on keyboard-triggered focus (Tab, arrow keys) */
3469
3476
*:focus-visible {
3470
3477
outline: 2px solid var(--color-accent);
3471
-
outline-offset: 2px;
3478
+
outline-offset: 1px;
3472
3479
}
3473
3480
3474
-
/* Toolbar buttons get a tighter outline */
3481
+
/* Buttons and toolbar items: even subtler focus ring */
3475
3482
.tb-btn:focus-visible,
3476
3483
.toolbar-dropdown-toggle:focus-visible,
3477
-
.toolbar-overflow-toggle:focus-visible {
3478
-
outline: 2px solid var(--color-accent);
3479
-
outline-offset: 1px;
3480
-
}
3481
-
3482
-
/* Remove default focus outline (replaced by focus-visible) */
3483
-
*:focus:not(:focus-visible) {
3484
-
outline: none;
3484
+
.toolbar-overflow-toggle:focus-visible,
3485
+
button:focus-visible {
3486
+
outline: 1.5px solid var(--color-accent);
3487
+
outline-offset: 0px;
3485
3488
}
3486
3489
3487
3490
/* ========================================================