diff --git a/src/app/Nav.vue b/src/app/Nav.vue index 59e872b..a9116fa 100644 --- a/src/app/Nav.vue +++ b/src/app/Nav.vue @@ -19,7 +19,7 @@ Library - + Albums diff --git a/src/app/Sidebar.vue b/src/app/Sidebar.vue index 765006e..629a038 100644 --- a/src/app/Sidebar.vue +++ b/src/app/Sidebar.vue @@ -51,7 +51,7 @@ margin-right: 0.75rem; } - .sidebar-container .nav-link:not(.active) .b-icon { + .sidebar-container .nav-link:not(.router-link-active) .b-icon { color: var(--text-muted); } .sidebar-container .nav-link:hover { @@ -59,6 +59,7 @@ background-color: rgba(255, 255, 255, 0.045); } .sidebar-container .nav-link.router-link-active { + color: var(--primary); background-color: rgba(255, 255, 255, 0.045); } .sidebar-container .nav-link.router-link-active:hover { diff --git a/src/shared/router.ts b/src/shared/router.ts index 203930c..c142bf0 100644 --- a/src/shared/router.ts +++ b/src/shared/router.ts @@ -44,6 +44,14 @@ export function setupRouter(auth: AuthService) { path: '/queue', component: Queue, }, + { + name: 'albums-default', + path: '/albums', + redirect: ({ + name: 'albums', + params: { sort: 'recently-added' } + }), + }, { name: 'albums', path: '/albums/:sort', @@ -52,7 +60,7 @@ export function setupRouter(auth: AuthService) { }, { name: 'album', - path: '/album/:id', + path: '/albums/id/:id', component: AlbumDetails, props: true, }, @@ -63,7 +71,7 @@ export function setupRouter(auth: AuthService) { }, { name: 'artist', - path: '/artist/:id', + path: '/artists/:id', component: ArtistDetails, props: true, }, @@ -74,7 +82,7 @@ export function setupRouter(auth: AuthService) { }, { name: 'genre', - path: '/genre/:id/:section?', + path: '/genres/:id/:section?', component: GenreDetails, props: true, }, @@ -95,7 +103,7 @@ export function setupRouter(auth: AuthService) { }, { name: 'podcast', - path: '/podcast/:id', + path: '/podcasts/:id', component: PodcastDetails, props: true, },