Merge pull request #24255 from nextcloud/bugfix/noid/missing-checkbox-focus

Add focus-visible outline for checkboxes and radio buttons
This commit is contained in:
Vincent Petry 2021-02-26 11:22:19 +01:00 committed by GitHub
commit 18b419f0ca
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 0 deletions

View File

@ -290,6 +290,9 @@ table th#headerName {
height: 50px;
}
table th#headerSelection {
padding-top: 2px;
}
table th#headerSize, table td.filesize {
text-align: right;
}
@ -482,6 +485,10 @@ table td.selection {
.select-all + label {
padding: 16px;
}
#fileList tr td.selection>.selectCheckBox:focus-visible + label,
.select-all:focus-visible + label {
outline-offset: 0px;
}
#fileList tr td.filename {
position: relative;

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-main-text);
outline-width: 1px;
outline-offset: 2px;
}
&:checked + label:before,
&.checkbox:indeterminate + label:before {
/* ^ :indeterminate have a strange behavior on radio,