Browse Source

Add focus-visible outline for checkboxes and radio buttons

To make keyboard navigation visible in forms.
When clicking with the mouse it doesn't appear.

Signed-off-by: Vincent Petry <vincent@nextcloud.com>
tags/v22.0.0beta1
Vincent Petry 3 years ago
parent
commit
23c143e034
No account linked to committer's email address
1 changed files with 6 additions and 0 deletions
  1. 6
    0
      core/css/inputs.scss

+ 6
- 0
core/css/inputs.scss View File

@@ -366,6 +366,12 @@ input {
&:focus + label:before {
border-color: var(--color-primary-element);
}
&:focus-visible + label {
outline-style: solid;
outline-color: var(--color-primary-element);
outline-width: 1px;
outline-offset: 2px;
}
&:checked + label:before,
&.checkbox:indeterminate + label:before {
/* ^ :indeterminate have a strange behavior on radio,

Loading…
Cancel
Save