✨ Add progress bar
This commit is contained in:
parent
509d433959
commit
280a180d9e
@ -6,12 +6,6 @@
|
|||||||
<link rel="apple-touch-icon" type="image/png" href="/apple-touch-icon.png" sizes="1024x1024">
|
<link rel="apple-touch-icon" type="image/png" href="/apple-touch-icon.png" sizes="1024x1024">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
|
||||||
<title>Solian</title>
|
<title>Solian</title>
|
||||||
|
|
||||||
<style>
|
|
||||||
html, body {
|
|
||||||
scroll-behavior: smooth;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
@ -22,6 +22,7 @@
|
|||||||
"@mdi/font": "^7.4.47",
|
"@mdi/font": "^7.4.47",
|
||||||
"dompurify": "^3.0.11",
|
"dompurify": "^3.0.11",
|
||||||
"marked": "^12.0.1",
|
"marked": "^12.0.1",
|
||||||
|
"nprogress": "^0.2.0",
|
||||||
"pinia": "^2.1.7",
|
"pinia": "^2.1.7",
|
||||||
"universal-cookie": "^7.1.0",
|
"universal-cookie": "^7.1.0",
|
||||||
"vue": "^3.4.21",
|
"vue": "^3.4.21",
|
||||||
@ -36,6 +37,7 @@
|
|||||||
"@tsconfig/node20": "^20.1.2",
|
"@tsconfig/node20": "^20.1.2",
|
||||||
"@types/dompurify": "^3.0.5",
|
"@types/dompurify": "^3.0.5",
|
||||||
"@types/node": "^20.11.28",
|
"@types/node": "^20.11.28",
|
||||||
|
"@types/nprogress": "^0.2.3",
|
||||||
"@unocss/reset": "^0.58.7",
|
"@unocss/reset": "^0.58.7",
|
||||||
"@vitejs/plugin-vue": "^5.0.4",
|
"@vitejs/plugin-vue": "^5.0.4",
|
||||||
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
||||||
|
@ -12,3 +12,11 @@ body,
|
|||||||
.no-scrollbar::-webkit-scrollbar {
|
.no-scrollbar::-webkit-scrollbar {
|
||||||
width: 0;
|
width: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
html, body {
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
#nprogress .bar {
|
||||||
|
background: #ffffff !important;
|
||||||
|
}
|
@ -3,6 +3,8 @@ import "virtual:uno.css"
|
|||||||
import "./assets/utils.css"
|
import "./assets/utils.css"
|
||||||
import "./assets/safe-area.css"
|
import "./assets/safe-area.css"
|
||||||
|
|
||||||
|
import "nprogress/nprogress.css"
|
||||||
|
|
||||||
import { createApp } from "vue"
|
import { createApp } from "vue"
|
||||||
import { createPinia } from "pinia"
|
import { createPinia } from "pinia"
|
||||||
|
|
||||||
@ -17,9 +19,16 @@ import "@mdi/font/css/materialdesignicons.min.css"
|
|||||||
import "@fontsource/roboto/latin.css"
|
import "@fontsource/roboto/latin.css"
|
||||||
import "@unocss/reset/tailwind.css"
|
import "@unocss/reset/tailwind.css"
|
||||||
|
|
||||||
|
import nprogress from "nprogress";
|
||||||
|
|
||||||
import index from "./index.vue"
|
import index from "./index.vue"
|
||||||
import router from "./router"
|
import router from "./router"
|
||||||
|
|
||||||
|
nprogress.configure({showSpinner: false})
|
||||||
|
nprogress.start()
|
||||||
|
|
||||||
|
window.onload = () => nprogress.done()
|
||||||
|
|
||||||
const app = createApp(index)
|
const app = createApp(index)
|
||||||
|
|
||||||
app.use(
|
app.use(
|
||||||
|
@ -1,6 +1,8 @@
|
|||||||
import { createRouter, createWebHistory } from "vue-router"
|
import { createRouter, createWebHistory } from "vue-router"
|
||||||
import MasterLayout from "@/layouts/master.vue"
|
import MasterLayout from "@/layouts/master.vue"
|
||||||
|
|
||||||
|
import nprogress from "nprogress";
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: createWebHistory(import.meta.env.BASE_URL),
|
history: createWebHistory(import.meta.env.BASE_URL),
|
||||||
routes: [
|
routes: [
|
||||||
@ -71,4 +73,11 @@ const router = createRouter({
|
|||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
|
||||||
|
router.beforeEach((_to, _from, next) => {
|
||||||
|
nprogress.start()
|
||||||
|
next()
|
||||||
|
})
|
||||||
|
|
||||||
|
router.afterEach(() => nprogress.done())
|
||||||
|
|
||||||
export default router
|
export default router
|
||||||
|
Reference in New Issue
Block a user