luzifer/twitch-bot
1
0
Fork 0
mirror of https://github.com/Luzifer/twitch-bot.git synced 2024-12-20 11:51:17 +00:00
Code Issues Projects Releases Wiki Activity

Improve sidenav display

Browse source 
by marking active item bold and using nested routes

Signed-off-by: Knut Ahlers <knut@ahlers.me>
This commit is contained in:
Knut Ahlers 2024-08-17 12:01:59 +02:00
parent 32df28f1d8
commit e16c623ec4
Signed by: luzifer
SSH key fingerprint: SHA256:/xtE5lCgiRDQr8SLxHMS92ZBlACmATUmF1crK16Ks4E
3 changed files with 109 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/main.ts
View file

@ -212,7 +212,6 @@ const app = createApp({
}) })
app.config.globalProperties.bus = mitt() app.config.globalProperties.bus = mitt()
app.config.globalProperties.$foo = 'bare'
app.use(i18n) app.use(i18n)
app.use(router) app.use(router)
app.mount('#app') app.mount('#app')

120
src/router.ts
View file

@ -6,29 +6,119 @@ import ChannelPermissions from './components/channelPermissions.vue'
import Dashboard from './components/dashboard.vue' import Dashboard from './components/dashboard.vue'
const routes = [ const routes = [
{ component: Dashboard, name: 'dashboard', path: '/' }, {
component: Dashboard,
name: 'dashboard',
path: '/',
},
// General settings // General settings
{ component: BothAuth, name: 'botAuth', path: '/bot-auth' }, {
{ component: ChannelOverview, name: 'channels', path: '/channels' }, component: BothAuth,
{ component: ChannelPermissions, name: 'channelPermissions', path: '/channels/:channel/permissions', props: true }, name: 'botAuth',
{ component: {}, name: 'editors', path: '/editors' }, path: '/bot-auth',
{ component: {}, name: 'tokens', path: '/tokens' }, },
{
children: [
{
component: ChannelOverview,
name: 'channels',
path: '',
},
{
component: ChannelPermissions,
name: 'channelPermissions',
path: ':channel', props: true,
},
],
path: '/channels',
},
{
component: {},
name: 'editors',
path: '/editors',
},
{
component: {},
name: 'tokens',
path: '/tokens',
},
// Auto-Messages // Auto-Messages
{ component: {}, name: 'autoMessagesList', path: '/auto-messages' }, {
{ component: {}, name: 'autoMessageEdit', path: '/auto-messages/edit/:id' }, children: [
{ component: {}, name: 'autoMessageNew', path: '/auto-messages/new' }, {
component: {},
name: 'autoMessagesList',
path: '',
},
{
component: {},
name: 'autoMessageEdit',
path: ':id',
},
{
component: {},
name: 'autoMessageNew',
path: 'new',
},
],
path: '/auto-messages',
},
// Rules // Rules
{ component: {}, name: 'rulesList', path: '/rules' }, {
{ component: {}, name: 'rulesEdit', path: '/rules/edit/:id' }, children: [
{ component: {}, name: 'rulesNew', path: '/rules/new' }, {
component: {},
name: 'rulesList',
path: '',
},
{
component: {},
name: 'rulesEdit',
path: ':id',
},
{
component: {},
name: 'rulesNew',
path: 'new',
},
],
path: '/rules',
},
// Raffles // Raffles
{ component: {}, name: 'rafflesList', path: '/raffles' }, {
{ component: {}, name: 'rafflesEdit', path: '/raffles/edit/:id' }, children: [
{ component: {}, name: 'rafflesNew', path: '/raffles/new' }, {
component: {},
name: 'rafflesList',
path: '',
},
{
children: [
{
component: {},
name: 'rafflesEdit',
path: '',
},
{
component: {},
name: 'raffleEntries',
path: 'entries',
},
],
path: ':id',
},
{
component: {},
name: 'rafflesNew',
path: 'new',
},
],
path: '/raffles',
},
] as RouteRecordRaw[] ] as RouteRecordRaw[]
const router = createRouter({ const router = createRouter({

4
src/style.scss
View file

@ -8,6 +8,10 @@ body,
height: 100%; height: 100%;
} }
.nav-link.router-link-active {
font-weight: bold;
}
.user-select-text { .user-select-text {
user-select: text !important; user-select: text !important;
} }