CGM_Public/pretix_original
2
0
Fork 1
mirror of https://github.com/pretix/pretix.git synced 2026-05-06 15:24:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

[A11y] fix border contrast for inputs

Browse Source
This commit is contained in:
Richard Schreiber
2025-04-23 14:34:50 +02:00
committed by GitHub
parent 2b245f727e
commit 48c2d57cd4
2 changed files with 21 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/pretix/static/pretixbase/scss/_theme.scss
View File

@@ -41,20 +41,22 @@ input[type=number]::-webkit-outer-spin-button {
}
.btn-default {
box-shadow: 0px 0px 0px 1px #cccccc inset;
box-shadow: 0px 0px 0px 1px $input-border inset;
box-sizing: border-box;
}
.btn-default:hover, .btn-default:focus {
box-shadow: 0px 0px 0px 1px #cccccc inset, inset 0 1px 3px 0 #BFBFBF;
box-shadow: 0px 0px 0px 1px $input-border inset, inset 0 1px 3px 0 #BFBFBF;
background: $btn-default-bg;
}
.btn-default:active, .btn-default:active:hover, .btn-default:active:focus {
box-shadow: 0px 0px 0px 1px #cccccc inset, inset 0 1px 8px 0 #BFBFBF;
background: $btn-default-bg;
outline: 0;
}
.btn-default.active, .btn-default.active:hover, .btn-default.active:focus {
box-shadow: 0px 0px 0px 1px $input-border inset, inset 0 1px 8px 0 #BFBFBF;
}
.btn-primary:hover, .btn-primary:focus {
box-shadow: inset 0 1px 3px 0 var(--pretix-brand-primary-shade-25);

17
src/pretix/static/pretixpresale/scss/main.scss
View File

@@ -1,5 +1,6 @@
// before variables.scss because it only affects presale, not control
$body-bg: #f5f5f5 !default;
$input-border: #949494;
$font-size-base: 0.875rem !default;/* 14px/16px = 0.875rem */
@@ -103,10 +104,24 @@ a, .btn-link {
/* see line 26, pretix/static/bootstrap/scss/bootstrap/_buttons.scss */
button:focus, a:focus, .btn:focus, summary:focus,
/*button:active, a:active, .btn:active, summary:active,*/
button:active:focus, a:active:focus, .btn:active:focus, summary:active:focus {
button:active:focus, a:active:focus, .btn:active:focus, summary:active:focus,
input:focus, .form-control:focus, .btn-checkbox:has(input:focus),
.input-item-count-group:has(input:focus), .input-group-price:has(input:focus) {
outline: 2px solid $link-hover-color;
outline-offset: 2px;
}
input:focus, .form-control:focus {
border-color: $input-border;
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-checkbox input:focus, .input-item-count-group input:focus, .input-group-price input:focus {
outline: none;
}
/* border-radius on these containers is needed for correctly rounded focus-outlines */
.input-item-count-group, .input-group-price {
border-radius: var(--pretix-border-radius-base);
}
footer {
clear: both;