style improvement
This commit is contained in:
parent
d49a47422e
commit
0c9211f27b
8 changed files with 666 additions and 277 deletions
2
assets/js/main.js
Normal file
2
assets/js/main.js
Normal file
|
@ -0,0 +1,2 @@
|
|||
import "./theme";
|
||||
import "./style";
|
6
assets/js/style.js
Normal file
6
assets/js/style.js
Normal file
|
@ -0,0 +1,6 @@
|
|||
// This file contains some codes to fix style of elements under `.md`
|
||||
document.querySelectorAll('.md ul').forEach(v => {
|
||||
if (/<li><input .+>.+<\/li>/.test(v.innerHTML)) {
|
||||
v.classList.add('ul-checkbox');
|
||||
}
|
||||
});
|
16
assets/js/theme.js
Normal file
16
assets/js/theme.js
Normal file
|
@ -0,0 +1,16 @@
|
|||
const light = '🌝', dark = '🌚';
|
||||
const LIGHT = 'light', DARK = 'dark';
|
||||
const themeSwitcher = document.getElementById('theme-switcher');
|
||||
|
||||
themeSwitcher.innerHTML = localStorage.theme === LIGHT ? light : dark;
|
||||
|
||||
themeSwitcher.addEventListener('click', function () {
|
||||
const currentTheme = localStorage.theme,
|
||||
newTheme = currentTheme === LIGHT ? DARK : LIGHT,
|
||||
{ classList } = document.querySelector('html'),
|
||||
text = newTheme === LIGHT ? light : dark;
|
||||
classList.remove(currentTheme);
|
||||
classList.add(newTheme);
|
||||
localStorage.theme = newTheme;
|
||||
themeSwitcher.innerHTML = text;
|
||||
});
|
Loading…
Add table
Add a link
Reference in a new issue