TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat: show progress bar when navigating to different routes

Browse source
This commit is contained in:
rramiachraf 2023-03-09 20:04:58 +01:00
parent ed7be09e54
commit 7e8833b584
4 changed files with 25 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -18,6 +18,7 @@
"hotkeys-js": "3.10.1",
"javascript-time-ago": "2.5.9",
"mux.js": "6.3.0",
"nprogress": "^0.2.0",
"shaka-player": "4.3.5",
"stream-browserify": "3.0.0",
"vue": "3.2.47",

7
src/App.vue
View file

@ -272,4 +272,11 @@ h2 {
.thumbnail-left {
@apply bottom-5px left-5px text-xs font-bold bg-red-600 uppercase;
}
#nprogress .bar {
background: #ed3e2d;
}
#nprogress .peg {
box-shadow: 0 0 10px #ed3e2d, 0 0 5px #ed3e2d;
}
</style>

12
src/router/router.js
View file

@ -1,4 +1,6 @@
import { createRouter, createWebHistory } from "vue-router";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
const routes = [
{
@ -95,4 +97,14 @@ const router = createRouter({
},
});
NProgress.configure({ showSpinner: false });
router.beforeEach(() => {
NProgress.start();
});
router.afterEach(() => {
NProgress.done();
});
export default router;

5
yarn.lock
View file

@ -3960,6 +3960,11 @@ npm-run-path@^4.0.1:
dependencies:
path-key "^3.0.0"
nprogress@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/nprogress/-/nprogress-0.2.0.tgz#cb8f34c53213d895723fcbab907e9422adbcafb1"
integrity sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==
nth-check@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-2.0.1.tgz#2efe162f5c3da06a28959fbd3db75dbeea9f0fc2"