Dark theme via DarkReader (#595)
* Initial commit for dark theme. * Use DarkReader.auto() to watch for system theme. * Tunning default parameters. * Allow configurable number of recent posts. * Added invisible element to hack theme initialization. * Added default value. * Use Darkreader CDN. * Cleanup to keep darkreader in as few files as possible. * Renamed darkmode.js to darkmode-darkreader.js. * Bring back the initialization. * Added provider property. * Added theme selector to the posts navbar. * Removed extra line breaks. * Changed darkreader CDN to local copy. * Renamed to darkMode. * Fixed CodeQL failures. * Added icons. * Renamed function. * Added SVG inversion. * Used icons for selection. * Toggle initial dark only in the dynamic navbar. Co-authored-by: donfiguerres <donfiguerres@github.com> Co-authored-by: Emruz Hossain <hossainemruz@gmail.com>
This commit is contained in:
parent
869eba97a2
commit
65049cfbb7
12 changed files with 5791 additions and 1 deletions
20
static/css/colortheme/colortheme.css
Normal file
20
static/css/colortheme/colortheme.css
Normal file
|
@ -0,0 +1,20 @@
|
|||
/* Note: No need to invert when the screen is small because the navbar is
|
||||
collapsed to a hamburger menu. */
|
||||
@media only screen and (min-width: 1200px) {
|
||||
.dynamic-navbar .navbar-icon-svg-dark {
|
||||
filter: invert(1);
|
||||
};
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
.dropdown-menu-icons-only {
|
||||
width: 25px;
|
||||
min-width: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-icon-center {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue