jcarr
/
noVNC
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Avoid 2 borders when focus-visible on text inputs 

By having the focus-visible outline overlapping the regular border
things look a bit more sane on text input elements.
This commit is contained in:
Samuel Mannehed 2025-01-12 23:44:16 +01:00
parent 91cd920266
commit f0ec3d62b5
1 changed files with 16 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/styles/input.css
View File

@ -60,6 +60,22 @@ textarea {
/* Account for borders on text inputs, buttons dont have borders */ /* Account for borders on text inputs, buttons dont have borders */
padding: calc(0.5em - 1px) var(--input-xpadding); padding: calc(0.5em - 1px) var(--input-xpadding);
} }
input:not([type]):focus-visible,
input[type=date]:focus-visible,
input[type=datetime-local]:focus-visible,
input[type=email]:focus-visible,
input[type=month]:focus-visible,
input[type=number]:focus-visible,
input[type=password]:focus-visible,
input[type=search]:focus-visible,
input[type=tel]:focus-visible,
input[type=text]:focus-visible,
input[type=time]:focus-visible,
input[type=url]:focus-visible,
input[type=week]:focus-visible,
textarea:focus-visible {
outline-offset: -1px;
}
/* ------- BUTTON ACTIVATIONS -------- */ /* ------- BUTTON ACTIVATIONS -------- */