mirror of
https://github.com/Horizontal42/summarum.git
synced 2026-11-11 02:12:00 +03:00
design: keyboard focus ring on form fields
Doc title, search input, and settings inputs/selects either zeroed out the default outline or never set one — Tab-only navigation had no visible indicator of what's focused. :focus-visible keeps mouse clicks silent and only rings for keyboard focus.
This commit is contained in:
parent
ec8b2f6448
commit
4302f7025c
1 changed files with 10 additions and 0 deletions
|
|
@ -59,6 +59,16 @@ button, .doc-item, .search-item, #rates-info, #total-line {
|
|||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
|
||||
::-webkit-scrollbar-thumb:hover { background: var(--fg-muted); }
|
||||
/* keyboard-only focus ring (mouse clicks don't trigger :focus-visible) on the
|
||||
form fields that otherwise zero out — or never set — a visible outline */
|
||||
#doc-title:focus-visible,
|
||||
#search-input:focus-visible,
|
||||
#settings-panel input:focus-visible,
|
||||
#settings-panel select:focus-visible,
|
||||
.path-btn:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
html, body { margin: 0; height: 100%; }
|
||||
body {
|
||||
font-family: var(--font);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue