Merge branch 'vuetify' into 'main'

Vuetify

See merge request !1

app.vue

 <template>
-  <client-only>
-    <app-navbar />
-  </client-only>
-  <nuxt-page />
+  <NuxtLayout>
+     <NuxtPage />
+  </NuxtLayout>
 </template>

components/AppNavbar.vue

-<script setup lang="ts">
-const { $keycloak } = useNuxtApp();
-
-const login = () => {
-  $keycloak.login()
-}
-
-const logout = () => {
-  $keycloak.logout({ redirectUri: location.origin + "/" });
-}
-
-</script>
-
-<template>
-  <div>
-    <button @click="logout" v-if="$keycloak.authenticated">Logout</button>
-    <button @click="login" v-else>Login</button>
-  </div>
-</template>

layouts/default.vue

+<template>
+<v-app>
+<v-app-bar color="black" flat="true">
+  <template v-slot:prepend>
+    <v-app-bar-nav-icon></v-app-bar-nav-icon>
+  </template>
+
+  <template v-slot:append>
+  <v-btn v-if="$keycloak.authenticated" variant="text" @click="$keycloak.logout()" append-icon="mdi-logout-variant" class="auth-button">
+  {{ $keycloak.tokenParsed.name }}
+  <template v-slot:append>
+    <v-icon color="success" title="Odhlásit se"></v-icon>
+  </template>
+  </v-btn>
+  <v-btn v-else variant="outlined" @click="$keycloak.login()" class="auth-button">Přihlásit se</v-btn>
+  </template>
+
+  <v-app-bar-title>Pirátská aplikace</v-app-bar-title>
+</v-app-bar>
+<v-main>
+<v-container>	
+<slot />
+</v-container>	
+</v-main>
+</v-app>
+
+
+
+</template>
+
+<script>
+const { $keycloak } = useNuxtApp();
+
+export default {
+  name: 'default',
+  data () {
+    return {
+    }
+  },
+}
+</script>
+
+<style>
+.auth-button {
+  text-transform: none;
+  font-weight: bold;
+}
+</style>

nuxt.config.ts

@@ -4,6 +4,13 @@ export default defineNuxtConfig({
   devtools: { enabled: false },
   ssr: false,
 
+  //  app: {
+  //    head: {
+  //      link: [
+  //        { rel: 'stylesheet', href: 'https://styleguide.pirati.cz/2.9.1/css/styles.css' }
+  //      ]
+  //    }
+  //  },
   runtimeConfig: {
     public: {
       keycloakUrl: "https://auth.pirati.cz/auth",
@@ -12,4 +19,14 @@ export default defineNuxtConfig({
     },
   },
 
+  modules: ["vuetify-nuxt-module"],
+
+  vuetify: {
+    moduleOptions: {
+      /* module specific options */
+    },
+    vuetifyOptions: {
+      /* vuetify options */
+    }
+  }
 })

package.json

@@ -14,6 +14,7 @@
     "nuxt": "^3.16.1",
     "remeda": "^2.21.2",
     "vue": "^3.5.13",
-    "vue-router": "^4.5.0"
+    "vue-router": "^4.5.0",
+    "vuetify-nuxt-module": "^0.18.4"
   }
 }