github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-21 17:26:29 -05:00
Code Issues Projects Releases Packages Wiki Activity

fix: show modal close button with correct color in dark mode

Browse source 
Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-03-27 14:54:30 +02:00
parent 3dc60407b6
commit 438a5466e0
3 changed files with 7 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
frontend/global-styles/colors-only-bootstrap/_close.scss
View file

@ -10,12 +10,12 @@
// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
.btn-close {
color: $btn-close-color;
color: var(--bs-modal-color);
background: transparent escape-svg($btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements
// Override <a>'s hover style
&:hover {
color: $btn-close-color;
color: var(--bs-modal-color);
}
&:focus {

4
frontend/global-styles/dark.scss
View file

@ -23,4 +23,8 @@ body.dark {
--#{$prefix}body-bg: #{$body-bg};
@import "colors-only-bootstrap/bootstrap";
.btn-close {
filter: invert(1);
}
}

1
frontend/global-styles/variables.dark.scss
View file

@ -103,6 +103,7 @@ $toast-background-color: $gray-700;
$toast-header-background-color: $gray-800;
// Modals
$modal-content-color: $dark;
$modal-content-bg: $gray-800;
$modal-content-border-color: $gray-700;
$modal-header-border-color: $gray-700;