This commit is contained in:
thofx
2023-09-19 22:11:58 +08:00
parent 2e987701a8
commit bb79aaed8b
8 changed files with 136 additions and 116 deletions
+1 -2
View File
@@ -30,12 +30,10 @@
</head> </head>
<body> <body>
<div id="app">
<div id="loading-bg"> <div id="loading-bg">
<div class="loading-logo"> <div class="loading-logo">
<!-- Logo --> <!-- Logo -->
<svg width="100px" height="100px" viewBox="0 0 192 192" version="1.1" xmlns="http://www.w3.org/2000/svg" <svg width="100px" height="100px" viewBox="0 0 192 192" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/"
style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g transform="matrix(1,0,0,1,-2606,-236)"> <g transform="matrix(1,0,0,1,-2606,-236)">
<g id="a2-c" transform="matrix(1,0,0,1,2606,236)"> <g id="a2-c" transform="matrix(1,0,0,1,2606,236)">
@@ -145,6 +143,7 @@
<div class="effect-3 effects"></div> <div class="effect-3 effects"></div>
</div> </div>
</div> </div>
<div id="app">
</div> </div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
<script> <script>
+3 -2
View File
@@ -11,10 +11,11 @@ html {
#loading-bg { #loading-bg {
position: absolute; position: absolute;
z-index: 999;
display: block; display: block;
background: var(--initial-loader-bg, #fff); background: var(--initial-loader-bg, #fff);
block-size: 100%; block-size: 100vh;
inline-size: 100%; inline-size: 100vw;
} }
.loading-logo { .loading-logo {
@@ -33,3 +33,11 @@ $ps-track-size: 0.5rem;
.ps__thumb-y { .ps__thumb-y {
background-color: rgb(var(--v-theme-perfect-scrollbar-thumb)) !important; background-color: rgb(var(--v-theme-perfect-scrollbar-thumb)) !important;
} }
// fix bug
@media(hover: none) {
.ps > .ps__rail-x,
.ps > .ps__rail-y {
opacity: 0.6;
}
}
+3 -5
View File
@@ -49,9 +49,7 @@ function handleNavScroll(evt: Event) {
]" ]"
> >
<!-- 👉 Header --> <!-- 👉 Header -->
<div <div class="nav-header">
class="nav-header"
>
<slot name="nav-header"> <slot name="nav-header">
<RouterLink to="/" class="app-logo d-flex align-center app-title-wrapper"> <RouterLink to="/" class="app-logo d-flex align-center app-title-wrapper">
<div class="d-flex" v-html="logo" /> <div class="d-flex" v-html="logo" />
@@ -81,8 +79,8 @@ function handleNavScroll(evt: Event) {
</template> </template>
<style lang="scss"> <style lang="scss">
@use "@configured-variables" as variables; @use '@configured-variables' as variables;
@use "@layouts/styles/mixins"; @use '@layouts/styles/mixins';
// 👉 Vertical Nav // 👉 Vertical Nav
.layout-vertical-nav { .layout-vertical-nav {
+6 -2
View File
@@ -11,6 +11,7 @@ import '@core/scss/template/index.scss'
import '@layouts/styles/index.scss' import '@layouts/styles/index.scss'
import '@styles/styles.scss' import '@styles/styles.scss'
import 'vue-toast-notification/dist/theme-default.css' import 'vue-toast-notification/dist/theme-default.css'
import { removeEl } from '@/util'
loadFonts() loadFonts()
@@ -18,10 +19,13 @@ loadFonts()
const app = createApp(App) const app = createApp(App)
// Use plugins Mount vue app // Use plugins Mount vue app
app.use(vuetify) app
.use(vuetify)
.use(router) .use(router)
.use(store) .use(store)
.use(ToastPlugin, { .use(ToastPlugin, {
position: 'bottom-right', position: 'bottom-right',
}) })
.use(VuetifyUseDialog).mount('#app') .use(VuetifyUseDialog)
.mount('#app')
.$nextTick(() => removeEl('#loading-bg'))
+6
View File
@@ -0,0 +1,6 @@
export function removeEl(selector: string) {
if (selector) {
const el = document.querySelector(selector)
el?.parentNode?.removeChild(el)
}
}
+1
View File
@@ -0,0 +1 @@
export * from './dom'
+3
View File
@@ -4,6 +4,9 @@ module.exports = {
theme: { theme: {
extend: {}, extend: {},
}, },
future: {
hoverOnlyWhenSupported: true,
},
corePlugins: { corePlugins: {
aspectRatio: false, aspectRatio: false,
}, },