blackteay/vue3-vant4-mobile
1
0
Fork 0
mirror of https://github.com/xiangshu233/vue3-vant4-mobile.git synced 2025-04-05 06:22:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: ♻️ 优化 loading icon 设置主题颜色逻辑

Browse Source
This commit is contained in:
xiangshu233 2024-02-26 21:35:28 +08:00
parent 3b02172ca2
commit 5351c56aa1
1 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
index.html
View File

@ -9,25 +9,26 @@
<body>
<div id="app">
<script>
const appDesignSetting = window.localStorage.getItem('DESIGN-SETTING')
const designSetting = JSON.parse(
window.localStorage.getItem('DESIGN-SETTING'),
)
;(() => {
let htmlRoot = document.getElementById('htmlRoot')
let darkMode =
appDesignSetting && JSON.parse(appDesignSetting).darkMode
let darkMode = designSetting.darkMode
if (htmlRoot && darkMode) {
htmlRoot.setAttribute('data-theme', darkMode)
darkMode = htmlRoot = null
} else {
htmlRoot.setAttribute('data-theme', 'light')
}
})()
document.addEventListener('DOMContentLoaded', (event) => {
const elements = document.querySelectorAll('.dot-spin i')
elements.forEach((element) => {
element.style.background = JSON.parse(appDesignSetting).appTheme
})
})
// 设置主题色变量
document.documentElement.style.setProperty(
'--app-theme-color',
designSetting.appTheme,
)
})()
</script>
<style>
body {
@ -68,7 +69,7 @@
height: 14px;
position: absolute;
display: block;
/* background-color: #1890ff; */
background: var(--app-theme-color);
border-radius: 100%;
transform: scale(0.75);
transform-origin: 50% 50%;