diff options
Diffstat (limited to 'web/html/xui/component/themeSwitch.html')
| -rw-r--r-- | web/html/xui/component/themeSwitch.html | 25 |
1 files changed, 15 insertions, 10 deletions
diff --git a/web/html/xui/component/themeSwitch.html b/web/html/xui/component/themeSwitch.html index 0de64a84..28cb79b1 100644 --- a/web/html/xui/component/themeSwitch.html +++ b/web/html/xui/component/themeSwitch.html @@ -6,9 +6,13 @@ <a-icon type="bulb" :theme="themeSwitcher.isDarkTheme ? 'filled' : 'outlined'"></a-icon> <span>Theme</span> </span> - <a-menu-item id="change-theme" class="ant-menu-theme-switch" @mousedown="themeSwitcher.animationsOff()"> Dark <a-switch style="margin-left: 2px;" size="small" :default-checked="themeSwitcher.isDarkTheme" @change="themeSwitcher.toggleTheme()"></a-switch> + <a-menu-item id="change-theme" class="ant-menu-theme-switch" @mousedown="themeSwitcher.animationsOff()"> Dark + <a-switch style="margin-left: 2px;" size="small" :default-checked="themeSwitcher.isDarkTheme" + @change="themeSwitcher.toggleTheme()"></a-switch> </a-menu-item> - <a-menu-item id="change-theme-ultra" v-if="themeSwitcher.isDarkTheme" class="ant-menu-theme-switch" @mousedown="themeSwitcher.animationsOffUltra()"> Ultra <a-checkbox style="margin-left: 2px;" :checked="themeSwitcher.isUltra" @click="themeSwitcher.toggleUltra()"></a-checkbox> + <a-menu-item id="change-theme-ultra" v-if="themeSwitcher.isDarkTheme" class="ant-menu-theme-switch" + @mousedown="themeSwitcher.animationsOffUltra()"> Ultra <a-checkbox style="margin-left: 2px;" + :checked="themeSwitcher.isUltra" @click="themeSwitcher.toggleUltra()"></a-checkbox> </a-menu-item> </a-sub-menu> </a-menu> @@ -17,12 +21,15 @@ {{define "component/themeSwitchTemplateLogin"}} <template> - <a-menu @mousedown="themeSwitcher.animationsOff()" id="change-theme" :theme="themeSwitcher.currentTheme" mode="inline" selected-keys=""> + <a-menu @mousedown="themeSwitcher.animationsOff()" id="change-theme" :theme="themeSwitcher.currentTheme" mode="inline" + selected-keys=""> <a-menu-item mode="inline" class="ant-menu-theme-switch"> <a-icon type="bulb" :theme="themeSwitcher.isDarkTheme ? 'filled' : 'outlined'"></a-icon> - <a-switch size="small" :default-checked="themeSwitcher.isDarkTheme" @change="themeSwitcher.toggleTheme()"></a-switch> + <a-switch size="small" :default-checked="themeSwitcher.isDarkTheme" + @change="themeSwitcher.toggleTheme()"></a-switch> <template v-if="themeSwitcher.isDarkTheme"> - <a-checkbox style="margin-left: 1rem; vertical-align: middle;" :checked="themeSwitcher.isUltra" @click="themeSwitcher.toggleUltra()">Ultra</a-checkbox> + <a-checkbox style="margin-left: 1rem; vertical-align: middle;" :checked="themeSwitcher.isUltra" + @click="themeSwitcher.toggleUltra()">Ultra</a-checkbox> </template> </a-menu-item> </a-menu> @@ -83,8 +90,7 @@ }; } const themeSwitcher = createThemeSwitcher(); - Vue.component('theme-switch', { - props: [], + Vue.component('a-theme-switch', { template: `{{template "component/themeSwitchTemplate"}}`, data: () => ({ themeSwitcher @@ -96,8 +102,7 @@ document.getElementById('message').className = themeSwitcher.currentTheme; } }); - Vue.component('theme-switch-login', { - props: [], + Vue.component('a-theme-switch-login', { template: `{{template "component/themeSwitchTemplateLogin"}}`, data: () => ({ themeSwitcher @@ -110,4 +115,4 @@ } }); </script> -{{end}} +{{end}}
\ No newline at end of file |