mixel/DocuSphere
1
0
Fork 0
Code Issues 6 Pull requests 1 Actions Packages Projects Releases Wiki Activity

1. still no clue nothing works

Browse source
This commit is contained in:
Mika Bomm 2024-09-04 19:09:31 +02:00
parent d8ce99319c
commit caf13fab2f
2 changed files with 40 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

72
web/src/components/NavBar.vue
View file

@ -1,45 +1,51 @@
<script setup lang="ts">
import { ref } from "vue";
const expanded = defineProps();
const drawer = ref(false);
</script>
<template>
<v-app-bar rounded="lg">
<template v-slot:prepend>
<v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>
</template>
<v-container class="justify-center d-flex fill-height align-center">
<v-app-bar
rounded="lg"
class="mx-3 mt-2 w-auto max-width"
density="compact"
>
<template v-slot:prepend>
<v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>
</template>
<template v-slot:append>
<!-- FIXME: Button invisible -->
<v-btn icon="mdi-account" variant="text">
<v-menu activator="parent">
<v-list>
<v-list-item
v-for="(item, index) in [
{ title: 'Profile' },
{ title: 'Settings' },
{ title: 'Log Out' },
]"
:key="index"
:value="index"
>
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</v-btn>
</template>
</v-app-bar>
<template v-slot:append>
<!-- FIXME: Button invisible -->
<v-btn icon="mdi-account" variant="text">
<v-menu activator="parent">
<v-list>
<v-list-item
v-for="(item, index) in [
{ title: 'Profile' },
{ title: 'Settings' },
{ title: 'Log Out' },
]"
:key="index"
:value="index"
>
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</v-btn>
</template>
</v-app-bar>
<v-navigation-drawer v-if="drawer">
<v-list-item title="DocuSphere" subtitle="Vuetify"></v-list-item>
<v-divider></v-divider>
<v-list-item link title="List Item 1"></v-list-item>
<v-list-item link title="List Item 2"></v-list-item>
<v-list-item link title="List Item 3"></v-list-item>
</v-navigation-drawer>
<v-navigation-drawer v-if="drawer">
<v-list-item title="DocuSphere" subtitle="Vuetify"></v-list-item>
<v-divider></v-divider>
<v-list-item link title="List Item 1"></v-list-item>
<v-list-item link title="List Item 2"></v-list-item>
<v-list-item link title="List Item 3"></v-list-item>
</v-navigation-drawer>
</v-container>
</template>
.max-width { max-width: 90%; }
<style scoped></style>

2
web/src/plugins/vuetify.ts
View file

@ -14,6 +14,6 @@ import { createVuetify } from "vuetify";
// https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
export default createVuetify({
theme: {
defaultTheme: "dark", // 'light' | 'dark'
defaultTheme: "light", // 'light' | 'dark'
},
});