Implement proper dark mode (#800)

* Implement proper dark mode

Signed-off-by: hossainemruz <hossainemruz@gmail.com>

* Fix footer color in light mode

Signed-off-by: hossainemruz <hossainemruz@gmail.com>

---------

Signed-off-by: hossainemruz <hossainemruz@gmail.com>
This commit is contained in:
Emruz Hossain 2023-09-30 05:04:48 +06:00 committed by GitHub
parent 6dc9d1d33d
commit 5f0aebcf68
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
38 changed files with 1136 additions and 353 deletions

View file

@ -20,16 +20,16 @@ html {
}
body {
background-color: $bg-primary;
background-color: get-light-color('bg-primary');
font-family: 'Mulish';
}
.bg-primary {
background-color: $bg-primary !important;
background-color: get-light-color('bg-primary') !important;
}
.bg-secondary {
background-color: $bg-secondary !important;
background-color: get-light-color('bg-secondary') !important;
}
.flag-icon {
@ -55,12 +55,12 @@ body {
}
kbd {
background-color: $accent-color;
color: $text-over-accent-color;
background-color: get-light-color('accent-color');
color: get-light-color('text-over-accent-color');
}
mark {
background-color: $highlight-color;
background-color: get-light-color('highlight-color');
border-radius: 0.25rem;
}
@ -88,3 +88,24 @@ mark {
padding-right: 0;
}
}
html[data-theme='dark'] {
body {
background-color: get-dark-color('bg-primary');
color: get-dark-color('text-color');
}
.bg-primary {
background-color: get-dark-color('bg-primary') !important;
}
.bg-secondary {
background-color: get-dark-color('bg-secondary') !important;
}
kbd {
background-color: get-dark-color('accent-color');
color: get-dark-color('text-over-accent-color');
}
mark {
background-color: get-dark-color('highlight-color');
}
}