Created
June 17, 2022 16:35
-
-
Save davidscotson/446f5a637715af9d1db832f60640e705 to your computer and use it in GitHub Desktop.
Tweaks for Bootstrap 4.6 when in forced-color mode, see https://github.com/twbs/bootstrap/issues/35941
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Tweaks to Bootstrap to better support forced-color accessability mode. | |
// https://github.com/twbs/bootstrap/issues/35941 | |
@media (forced-colors) { | |
navbar.fixed-top { | |
border-bottom: 1px solid transparent; | |
} | |
input[type="submit"], | |
input[type="button"], | |
button { | |
outline: 1px solid LinkText !important; | |
} | |
.btn { | |
color: ButtonText !important; | |
background-color: ButtonFace !important; | |
} | |
.btn.btn-link { | |
color: LinkText; | |
background-color: Canvas; | |
} | |
.badge, | |
.label { | |
color: CanvasText; | |
background-color: Canvas; | |
outline: 1px solid CanvasText !important; | |
} | |
.progress { | |
border: 1px solid Graytext; | |
} | |
.progress-bar { | |
color: HighlightText; | |
background-color: Highlight !important; | |
} | |
form-control::placeholder, | |
.text-muted { | |
color: GrayText !important; | |
} | |
.custom-control.custom-radio, | |
.custom-control.custom-checkbox { | |
// Remove space left for custom overlap | |
margin-left: 0; | |
} | |
.custom-control-label::before, | |
.custom-control-label::after { | |
// Remove custom control overlay. | |
display: none; | |
} | |
.custom-control-input { | |
// Restore standard control visibility. | |
position: relative; | |
z-index: inherit; | |
opacity: 1; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment