f.weber/jekyll-theme-chirpy
Template
1
0
Fork 0
mirror of https://github.com/cotes2020/jekyll-theme-chirpy.git synced 2025-12-18 05:41:31 +00:00
Code Issues Packages Releases Activity

perf(assets): reduce HTTP requests to CDN

Browse Source
This commit is contained in:
Cotes Chung
2023-03-23 01:29:17 +08:00
parent 016a9baddd
commit 9d97120197
9 changed files with 167 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
_includes/mode-toggle.html
View File

@@ -1,14 +1,22 @@
<!--
Switch the mode between dark and light.
-->
<!-- Switch the mode between dark and light. -->
<script type="text/javascript">
class ModeToggle {
static get MODE_KEY() { return "mode"; }
static get MODE_ATTR() { return "data-mode"; }
static get DARK_MODE() { return "dark"; }
static get LIGHT_MODE() { return "light"; }
static get ID() { return "mode-toggle"; }
static get MODE_KEY() {
return 'mode';
}
static get MODE_ATTR() {
return 'data-mode';
}
static get DARK_MODE() {
return 'dark';
}
static get LIGHT_MODE() {
return 'light';
}
static get ID() {
return 'mode-toggle';
}
constructor() {
if (this.hasMode) {
@@ -45,17 +53,29 @@
});
} /* constructor() */
get sysDarkPrefers() { return window.matchMedia("(prefers-color-scheme: dark)"); }
get sysDarkPrefers() {
return window.matchMedia('(prefers-color-scheme: dark)');
}
get isSysDarkPrefer() { return this.sysDarkPrefers.matches; }
get isSysDarkPrefer() {
return this.sysDarkPrefers.matches;
}
get isDarkMode() { return this.mode === ModeToggle.DARK_MODE; }
get isDarkMode() {
return this.mode === ModeToggle.DARK_MODE;
}
get isLightMode() { return this.mode === ModeToggle.LIGHT_MODE; }
get isLightMode() {
return this.mode === ModeToggle.LIGHT_MODE;
}
get hasMode() { return this.mode != null; }
get hasMode() {
return this.mode != null;
}
get mode() { return sessionStorage.getItem(ModeToggle.MODE_KEY); }
get mode() {
return sessionStorage.getItem(ModeToggle.MODE_KEY);
}
/* get the current mode on screen */
get modeStatus() {
@@ -67,26 +87,29 @@
}
setDark() {
$('html').attr(ModeToggle.MODE_ATTR, ModeToggle.DARK_MODE);
document.documentElement.setAttribute(ModeToggle.MODE_ATTR, ModeToggle.DARK_MODE);
sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE);
}
setLight() {
$('html').attr(ModeToggle.MODE_ATTR, ModeToggle.LIGHT_MODE);
document.documentElement.setAttribute(ModeToggle.MODE_ATTR, ModeToggle.LIGHT_MODE);
sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE);
}
clearMode() {
$('html').removeAttr(ModeToggle.MODE_ATTR);
document.documentElement.removeAttribute(ModeToggle.MODE_ATTR);
sessionStorage.removeItem(ModeToggle.MODE_KEY);
}
/* Notify another plugins that the theme mode has changed */
notify() {
window.postMessage({
direction: ModeToggle.ID,
message: this.modeStatus
}, "*");
window.postMessage(
{
direction: ModeToggle.ID,
message: this.modeStatus
},
'*'
);
}
flipMode() {