mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-04-24 18:04:43 +02:00
Code Issues Projects Releases Wiki Activity

MDL-73026 theme: Override Bootstrap modal styles for close button

Browse Source 
* Adjust the margins to accommodate the button outline so that it
doesn't look clipped.
* Inherit the opacity when the button receives focus to improve the
focus outline's contrast.
This commit is contained in:
Jun Pataleta 2021-11-08 21:43:17 +08:00
parent d135a1200a
commit 2fcf41dcee
3 changed files with 23 additions and 0 deletions
theme
boost
scss/moodle
modal.scss
style
moodle.css
classic/style
moodle.css

13
theme/boost/scss/moodle/modal.scss

@ -15,4 +15,17 @@
}
}
}
// Override Bootstrap .close for better accessibility.
.close {
// Adjust the margins so the focus outline does not look clipped.
margin: -0.8rem -0.8rem -0.8rem auto;
// Inherit the opacity when focus is received for better focus outline contrast.
&:not(:disabled):not(.disabled) {
@include hover-focus() {
opacity: inherit;
}
}
}
}

5
theme/boost/style/moodle.css

@ -19948,6 +19948,11 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
left: 50%;
transform: translate(-50%, -50%); }
.modal .close {
margin: -0.8rem -0.8rem -0.8rem auto; }
.modal .close:not(:disabled):not(.disabled):hover, .modal .close:not(:disabled):not(.disabled):focus {
opacity: inherit; }
.layout.fullscreen {
height: 100vh;
position: fixed;

5
theme/classic/style/moodle.css

@ -19894,6 +19894,11 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
left: 50%;
transform: translate(-50%, -50%); }
.modal .close {
margin: -0.8rem -0.8rem -0.8rem auto; }
.modal .close:not(:disabled):not(.disabled):hover, .modal .close:not(:disabled):not(.disabled):focus {
opacity: inherit; }
.layout.fullscreen {
height: 100vh;
position: fixed;