sebclem/Claptrap-ui
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

✏️ Add icon in title

Browse Source
This commit is contained in:
SebClem 2022-06-12 12:51:05 +02:00
parent 82b2148d86
commit d90a34435f
Signed by: sebclem
GPG Key ID: 5A4308F6A359EA50
8 changed files with 15 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -2,3 +2,5 @@ VITE_OAUTH_REDIRECT_URL="https://discord.com/api/oauth2/authorize?client_id=2383
VITE_API_BASE_URL="http://localhost:8080/api/v2/" VITE_API_BASE_URL="http://localhost:8080/api/v2/"
VITE_DISCORD_USER_AVATAR_URL="https://cdn.discordapp.com/avatars/" VITE_DISCORD_USER_AVATAR_URL="https://cdn.discordapp.com/avatars/"
VITE_APP_TITLE="Claptrap DEV"

1
env.d.ts vendored
View File

@ -3,6 +3,7 @@ interface ImportMetaEnv {
readonly VITE_OAUTH_REDIRECT_URL: string; readonly VITE_OAUTH_REDIRECT_URL: string;
readonly VITE_API_BASE_URL: string; readonly VITE_API_BASE_URL: string;
readonly VITE_DISCORD_USER_AVATAR_URL: string; readonly VITE_DISCORD_USER_AVATAR_URL: string;
readonly VITE_APP_TITLE: string;
// more env variables... // more env variables...
} }

2
index.html
View File

@ -5,7 +5,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vuetify 3 Vite Preview</title> <title>Claptrap Bot</title>
</head> </head>
<body> <body>

BIN
public/favicon.ico
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 15 KiB

BIN
public/icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 55 KiB

0
public/index.html
View File

5
src/components/Header/HeaderComponent.vue
View File

@ -1,7 +1,10 @@
<template> <template>
<v-app-bar class="bg-brown-darken-4"> <v-app-bar class="bg-brown-darken-4">
<v-app-bar-title class="text-yellow font-weight-black text-h4"> <v-app-bar-title class="text-yellow font-weight-black text-h4">
Claptrap Bot <div class="d-flex align-center">
<v-avatar><v-img src="/icon.png"></v-img></v-avatar>
<span class="ml-3">Claptrap Bot</span>
</div>
</v-app-bar-title> </v-app-bar-title>
</v-app-bar> </v-app-bar>
<v-navigation-drawer expand-on-hover rail position="right" v-if="isLoggedIn"> <v-navigation-drawer expand-on-hover rail position="right" v-if="isLoggedIn">

6
src/router/index.ts
View File

@ -11,6 +11,7 @@ import HomeView from "../views/HomeView.vue";
declare module "vue-router" { declare module "vue-router" {
interface RouteMeta { interface RouteMeta {
requiresAuth: boolean; requiresAuth: boolean;
title: string;
} }
} }
@ -23,6 +24,7 @@ const router = createRouter({
component: HomeView, component: HomeView,
meta: { meta: {
requiresAuth: false, requiresAuth: false,
title: "Home",
}, },
}, },
{ {
@ -31,6 +33,7 @@ const router = createRouter({
component: GuildHomeViewVue, component: GuildHomeViewVue,
meta: { meta: {
requiresAuth: true, requiresAuth: true,
title: "Home",
}, },
}, },
{ {
@ -39,6 +42,7 @@ const router = createRouter({
component: OauthCallbackViewVue, component: OauthCallbackViewVue,
meta: { meta: {
requiresAuth: false, requiresAuth: false,
title: "Login",
}, },
}, },
{ {
@ -47,6 +51,7 @@ const router = createRouter({
component: OauthRedirectViewVue, component: OauthRedirectViewVue,
meta: { meta: {
requiresAuth: false, requiresAuth: false,
title: "Login",
}, },
}, },
], ],
@ -54,6 +59,7 @@ const router = createRouter({
router.beforeEach((to, from) => { router.beforeEach((to, from) => {
const store = useUserStore(); const store = useUserStore();
document.title = `${import.meta.env.VITE_APP_TITLE} - ${to.meta.title}`;
if (to.meta.requiresAuth && !store.isLoggedIn) { if (to.meta.requiresAuth && !store.isLoggedIn) {
return { name: "oauth-redirect" }; return { name: "oauth-redirect" };
} else { } else {