commit 46f0b4c84c949672c1d6022de6ab71149aa653df
parent e2455284496b13de6ad44fa7ce360739aaac242a
Author: oscarbenedito <oscar@oscarbenedito.com>
Date: Wed, 25 Mar 2020 10:29:12 +0100
Theme toggles if prefers-color-scheme is dark
Diffstat:
4 files changed, 18 insertions(+), 12 deletions(-)
diff --git a/assets/css/composer.scss b/assets/css/composer.scss
@@ -33,8 +33,11 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
@include darkcolors;
}
}
-.dark {
+.toggled {
@include darkcolors;
+ @media (prefers-color-scheme: dark) {
+ @include lightcolors;
+ }
}
.mono {
--font-family: 'mono';
diff --git a/assets/css/style.scss b/assets/css/style.scss
@@ -89,8 +89,11 @@ permission notice:
@include darkcolors;
}
}
-.dark {
+.toggled {
@include darkcolors;
+ @media (prefers-color-scheme: dark) {
+ @include lightcolors;
+ }
}
/* Reset
-------------------------------------------------- */
diff --git a/assets/js/composer.js b/assets/js/composer.js
@@ -73,12 +73,12 @@ var saveEvent = function(event) {
}
}
function toggleTheme() {
- if (localStorage && localStorage.getItem('theme') == 'dark') {
+ if (localStorage && localStorage.getItem('theme') == 'toggled') {
localStorage.removeItem('theme');
} else if (localStorage) {
- localStorage.setItem('theme', 'dark');
+ localStorage.setItem('theme', 'toggled');
}
- document.documentElement.classList.toggle('dark');
+ document.documentElement.classList.toggle('toggled');
}
function toggleFont() {
if (localStorage && localStorage.getItem('font') == 'mono') {
@@ -94,8 +94,8 @@ if (key == '' || key == null) {
key = 'null';
}
key = 'k-' + key;
-if (localStorage && localStorage.getItem('theme') == 'dark') {
- document.documentElement.classList.toggle('dark');
+if (localStorage && localStorage.getItem('theme') == 'toggled') {
+ document.documentElement.classList.toggle('toggled');
}
if (localStorage && localStorage.getItem('font') == 'mono') {
document.documentElement.classList.toggle('mono');
diff --git a/assets/js/main.js b/assets/js/main.js
@@ -16,16 +16,16 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
'use strict';
function toggleTheme() {
- if (localStorage && localStorage.getItem('theme') === 'dark') {
+ if (localStorage && localStorage.getItem('theme') === 'toggled') {
localStorage.removeItem('theme');
} else if (localStorage) {
- localStorage.setItem('theme', 'dark');
+ localStorage.setItem('theme', 'toggled');
}
- document.body.classList.toggle('dark');
+ document.body.classList.toggle('toggled');
}
-if (localStorage && localStorage.getItem('theme') === 'dark') {
- document.body.classList.toggle('dark');
+if (localStorage && localStorage.getItem('theme') === 'toggled') {
+ document.body.classList.toggle('toggled');
}
function openMenu() {
