Skip to content

Commit b2ef445

Browse files
ArhellArhell
authored
revert changes (#248)
1 parent 578d183 commit b2ef445

File tree

2 files changed

+78
-77
lines changed

2 files changed

+78
-77
lines changed

‎_includes/js.html

+1-76
Original file line numberDiff line numberDiff line change
@@ -1,76 +1 @@
1-
<script>
2-
(() => {
3-
'use strict'
4-
5-
const getStoredTheme = () => localStorage.getItem('theme')
6-
const setStoredTheme = theme => localStorage.setItem('theme', theme)
7-
8-
const getPreferredTheme = () => {
9-
const storedTheme = getStoredTheme()
10-
if (storedTheme) {
11-
return storedTheme
12-
}
13-
14-
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
15-
}
16-
17-
const setTheme = theme => {
18-
if (theme === 'auto') {
19-
document.documentElement.setAttribute('data-theme', (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'))
20-
} else {
21-
document.documentElement.setAttribute('data-theme', theme)
22-
}
23-
}
24-
25-
setTheme(getPreferredTheme())
26-
27-
const showActiveTheme = (theme, focus = false) => {
28-
const themeSwitcher = document.querySelector('#bd-theme')
29-
30-
if (!themeSwitcher) {
31-
return
32-
}
33-
34-
const themeSwitcherText = document.querySelector('#bd-theme-text')
35-
const activeThemeIcon = document.querySelector('.theme-icon-active use')
36-
const btnToActive = document.querySelector(`[data-theme-value="${theme}"]`)
37-
const svgOfActiveBtn = btnToActive.querySelector('svg use').getAttribute('href')
38-
39-
document.querySelectorAll('[data-theme-value]').forEach(element => {
40-
element.classList.remove('active')
41-
element.setAttribute('aria-pressed', 'false')
42-
})
43-
44-
btnToActive.classList.add('active')
45-
btnToActive.setAttribute('aria-pressed', 'true')
46-
activeThemeIcon.setAttribute('href', svgOfActiveBtn)
47-
const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`
48-
themeSwitcher.setAttribute('aria-label', themeSwitcherLabel)
49-
50-
if (focus) {
51-
themeSwitcher.focus()
52-
}
53-
}
54-
55-
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
56-
const storedTheme = getStoredTheme()
57-
if (storedTheme !== 'light' && storedTheme !== 'dark') {
58-
setTheme(getPreferredTheme())
59-
}
60-
})
61-
62-
window.addEventListener('DOMContentLoaded', () => {
63-
showActiveTheme(getPreferredTheme())
64-
65-
document.querySelectorAll('[data-theme-value]')
66-
.forEach(toggle => {
67-
toggle.addEventListener('click', () => {
68-
const theme = toggle.getAttribute('data-theme-value')
69-
setStoredTheme(theme)
70-
setTheme(theme)
71-
showActiveTheme(theme, true)
72-
})
73-
})
74-
})
75-
})()
76-
</script>
1+
<script src="https://assets.phalcon.io/phalcon/test/core.js"></script>

‎_includes/meta.html

+77-1
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,83 @@
5050
<meta name="msapplication-config" content="https://assets.phalcon.io/phalcon/favicons/browserconfig.xml" />
5151
<meta name="msapplication-TileColor" content="#273646">
5252
<meta name="theme-color" content="#273646">
53-
<script>document.documentElement.classList.add(localStorage.getItem('mode') === 'auto' ? (matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light') : localStorage.getItem('mode'))</script>
53+
54+
<script>
55+
(() => {
56+
'use strict'
57+
58+
const getStoredTheme = () => localStorage.getItem('theme')
59+
const setStoredTheme = theme => localStorage.setItem('theme', theme)
60+
61+
const getPreferredTheme = () => {
62+
const storedTheme = getStoredTheme()
63+
if (storedTheme) {
64+
return storedTheme
65+
}
66+
67+
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
68+
}
69+
70+
const setTheme = theme => {
71+
if (theme === 'auto') {
72+
document.documentElement.setAttribute('data-theme', (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'))
73+
} else {
74+
document.documentElement.setAttribute('data-theme', theme)
75+
}
76+
}
77+
78+
setTheme(getPreferredTheme())
79+
80+
const showActiveTheme = (theme, focus = false) => {
81+
const themeSwitcher = document.querySelector('#bd-theme')
82+
83+
if (!themeSwitcher) {
84+
return
85+
}
86+
87+
const themeSwitcherText = document.querySelector('#bd-theme-text')
88+
const activeThemeIcon = document.querySelector('.theme-icon-active use')
89+
const btnToActive = document.querySelector(`[data-theme-value="${theme}"]`)
90+
const svgOfActiveBtn = btnToActive.querySelector('svg use').getAttribute('href')
91+
92+
document.querySelectorAll('[data-theme-value]').forEach(element => {
93+
element.classList.remove('active')
94+
element.setAttribute('aria-pressed', 'false')
95+
})
96+
97+
btnToActive.classList.add('active')
98+
btnToActive.setAttribute('aria-pressed', 'true')
99+
activeThemeIcon.setAttribute('href', svgOfActiveBtn)
100+
const themeSwitcherLabel = `${themeSwitcherText.textContent} (${btnToActive.dataset.bsThemeValue})`
101+
themeSwitcher.setAttribute('aria-label', themeSwitcherLabel)
102+
103+
if (focus) {
104+
themeSwitcher.focus()
105+
}
106+
}
107+
108+
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
109+
const storedTheme = getStoredTheme()
110+
if (storedTheme !== 'light' && storedTheme !== 'dark') {
111+
setTheme(getPreferredTheme())
112+
}
113+
})
114+
115+
window.addEventListener('DOMContentLoaded', () => {
116+
showActiveTheme(getPreferredTheme())
117+
118+
document.querySelectorAll('[data-theme-value]')
119+
.forEach(toggle => {
120+
toggle.addEventListener('click', () => {
121+
const theme = toggle.getAttribute('data-theme-value')
122+
setStoredTheme(theme)
123+
setTheme(theme)
124+
showActiveTheme(theme, true)
125+
})
126+
})
127+
})
128+
})()
129+
</script>
54130

55131
<link rel="stylesheet"
56132
href="https://assets.phalcon.io/phalcon/test/dark.css">

0 commit comments

Comments
 (0)