mirror of
https://github.com/picocss/pico.git
synced 2025-04-23 01:46:14 -04:00
Merge branch 'dev' into pr/174
This commit is contained in:
commit
b757cf37d2
2 changed files with 22 additions and 3 deletions
2
docs/js/commons.min.js
vendored
2
docs/js/commons.min.js
vendored
|
@ -1 +1 @@
|
|||
"use strict";!function(){var e={_scheme:"auto",change:{light:"<i>Turn on dark mode</i>",dark:"<i>Turn off dark mode</i>"},buttonsTarget:".theme-switcher",init:function(){this.scheme=this._scheme,this.initSwitchers()},get preferedColorScheme(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"},initSwitchers:function(){var t=this;document.querySelectorAll(this.buttonsTarget).forEach(function(e){e.addEventListener("click",function(){"dark"==t.scheme?t.scheme="light":t.scheme="dark"},!1)})},addButton:function(e){var t=document.createElement(e.tag);t.className=e.class,document.querySelector(e.target).appendChild(t)},set scheme(e){"auto"==e?"dark"==this.preferedColorScheme?this._scheme="dark":this._scheme="light":"dark"!=e&&"light"!=e||(this._scheme=e),this.applyScheme()},get scheme(){return this._scheme},applyScheme:function(){var i=this;document.querySelector("html").setAttribute("data-theme",this.scheme),document.querySelectorAll(this.buttonsTarget).forEach(function(e){var t="dark"==i.scheme?i.change.dark:i.change.light;e.innerHTML=t,e.setAttribute("aria-label",t.replace(/<[^>]*>?/gm,""))})}},t={_state:"closed-on-mobile",toggleLink:document.getElementById("toggle-docs-navigation"),nav:document.querySelector("main > aside > nav"),init:function(){this.onToggleClick()},onToggleClick:function(){var t=this;this.toggleLink.addEventListener("click",function(e){e.preventDefault(),"closed-on-mobile"==t.state?t.state="open":t.state="closed-on-mobile",t.nav.removeAttribute("class"),t.nav.classList.add(t.state)},!1)},get state(){return this._state},set state(e){this._state=e}};e.addButton({tag:"BUTTON",class:"contrast switcher theme-switcher",target:"body"}),e.init(),t.init()}();
|
||||
"use strict";!function(){var e={_scheme:"auto",change:{light:"<i>Turn on dark mode</i>",dark:"<i>Turn off dark mode</i>"},buttonsTarget:".theme-switcher",localStorageKey:"picoPreferedColorScheme",init:function(){this.scheme=this.schemeFromLocalStorage,this.initSwitchers()},get schemeFromLocalStorage(){return void 0!==window.localStorage&&null!==window.localStorage.getItem(this.localStorageKey)?window.localStorage.getItem(this.localStorageKey):this._scheme},get preferedColorScheme(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"},initSwitchers:function(){var t=this;document.querySelectorAll(this.buttonsTarget).forEach(function(e){e.addEventListener("click",function(){"dark"==t.scheme?t.scheme="light":t.scheme="dark"},!1)})},addButton:function(e){var t=document.createElement(e.tag);t.className=e.class,document.querySelector(e.target).appendChild(t)},set scheme(e){"auto"==e?"dark"==this.preferedColorScheme?this._scheme="dark":this._scheme="light":"dark"!=e&&"light"!=e||(this._scheme=e),this.applyScheme(),this.schemeToLocalStorage()},get scheme(){return this._scheme},applyScheme:function(){var o=this;document.querySelector("html").setAttribute("data-theme",this.scheme),document.querySelectorAll(this.buttonsTarget).forEach(function(e){var t="dark"==o.scheme?o.change.dark:o.change.light;e.innerHTML=t,e.setAttribute("aria-label",t.replace(/<[^>]*>?/gm,""))})},schemeToLocalStorage:function(){void 0!==window.localStorage&&window.localStorage.setItem(this.localStorageKey,this.scheme)}},t={_state:"closed-on-mobile",toggleLink:document.getElementById("toggle-docs-navigation"),nav:document.querySelector("main > aside > nav"),init:function(){this.onToggleClick()},onToggleClick:function(){var t=this;this.toggleLink.addEventListener("click",function(e){e.preventDefault(),"closed-on-mobile"==t.state?t.state="open":t.state="closed-on-mobile",t.nav.removeAttribute("class"),t.nav.classList.add(t.state)},!1)},get state(){return this._state},set state(e){this._state=e}};e.addButton({tag:"BUTTON",class:"contrast switcher theme-switcher",target:"body"}),e.init(),t.init()}();
|
|
@ -2,7 +2,7 @@
|
|||
* Theme switcher
|
||||
*
|
||||
* Pico.css - https://picocss.com
|
||||
* Copyright 2019-2021 - Licensed under MIT
|
||||
* Copyright 2019-2022 - Licensed under MIT
|
||||
*/
|
||||
|
||||
export const themeSwitcher = {
|
||||
|
@ -14,13 +14,24 @@ export const themeSwitcher = {
|
|||
dark: '<i>Turn off dark mode</i>',
|
||||
},
|
||||
buttonsTarget: '.theme-switcher',
|
||||
localStorageKey: 'picoPreferedColorScheme',
|
||||
|
||||
// Init
|
||||
init() {
|
||||
this.scheme = this._scheme;
|
||||
this.scheme = this.schemeFromLocalStorage;
|
||||
this.initSwitchers();
|
||||
},
|
||||
|
||||
// Get color scheme from local storage
|
||||
get schemeFromLocalStorage() {
|
||||
if (typeof window.localStorage !== 'undefined') {
|
||||
if (window.localStorage.getItem(this.localStorageKey) !== null) {
|
||||
return window.localStorage.getItem(this.localStorageKey);
|
||||
}
|
||||
}
|
||||
return this._scheme;
|
||||
},
|
||||
|
||||
// Prefered color scheme
|
||||
get preferedColorScheme() {
|
||||
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
||||
|
@ -52,6 +63,7 @@ export const themeSwitcher = {
|
|||
this._scheme = scheme;
|
||||
}
|
||||
this.applyScheme();
|
||||
this.schemeToLocalStorage();
|
||||
},
|
||||
|
||||
// Get scheme
|
||||
|
@ -71,6 +83,13 @@ export const themeSwitcher = {
|
|||
}
|
||||
);
|
||||
},
|
||||
|
||||
// Store scheme to local storage
|
||||
schemeToLocalStorage() {
|
||||
if (typeof window.localStorage !== 'undefined') {
|
||||
window.localStorage.setItem(this.localStorageKey, this.scheme);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
export default themeSwitcher;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue