fix: selects
This commit is contained in:
@@ -1,32 +1,32 @@
|
||||
<template>
|
||||
<header
|
||||
class="fixed top-0 left-0 right-0 z-50 bg-white/80 dark:bg-(--black) backdrop-blur-md border-b border-(--border-light) dark:border-(--border-dark)">
|
||||
<!-- px-4 sm:px-6 lg:px-8 -->
|
||||
<div class="container mx-auto px-4">
|
||||
<div class="flex items-center justify-between h-14">
|
||||
<!-- Logo -->
|
||||
<div class="flex items-center justify-between h-16">
|
||||
<RouterLink :to="{ name: 'home' }" class="flex items-center gap-2">
|
||||
<div class="w-8 h-8 rounded-lg bg-primary text-white flex items-center justify-center">
|
||||
<UIcon name="i-heroicons-clock" class="w-5 h-5" />
|
||||
</div>
|
||||
<span class="font-semibold text-gray-900 dark:text-white">TimeTracker</span>
|
||||
<span class="font-semibold text-gray-900 dark:text-white">{{ settings.app.name }}</span>
|
||||
</RouterLink>
|
||||
|
||||
<UNavigationMenu :type="'trigger'" :ui="{
|
||||
root: 'justify-center',
|
||||
list: 'gap-4'
|
||||
}" :items="menuItems" class="w-full"></UNavigationMenu>
|
||||
<div class="flex items-center gap-2">
|
||||
<CountryCurrencySwitch />
|
||||
<!-- Language Switcher -->
|
||||
<LangSwitch />
|
||||
<!-- Theme Switcher -->
|
||||
<ThemeSwitch />
|
||||
<!-- Logout Button (only when authenticated) -->
|
||||
<button v-if="authStore.isAuthenticated" @click="authStore.logout()"
|
||||
class="px-3 py-1.5 text-sm font-medium text-black dark:text-white hover:text-black dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600 rounded-lg transition-colors border border-(--border-light) dark:border-(--border-dark)">
|
||||
{{ $t('general.logout') }}
|
||||
</button>
|
||||
list: 'gap-4 text-(--black)',
|
||||
linkLabel: 'text-(--black) text-sm!'
|
||||
}" :items="menuItems" class="" />
|
||||
<div class="flex items-center gap-12">
|
||||
<div class="flex items-center gap-2">
|
||||
<CountryCurrencySwitch />
|
||||
<LangSwitch />
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<ThemeSwitch />
|
||||
<button v-if="authStore.isAuthenticated" @click="authStore.logout()"
|
||||
class="px-3 py-1.5 text-sm font-medium text-black dark:text-white hover:text-black dark:hover:text-white hover:bg-gray-100 dark:hover:bg-gray-600 rounded-lg transition-colors border border-(--border-light) dark:border-(--border-dark) whitespace-nowrap">
|
||||
{{ $t('general.logout') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -44,6 +44,7 @@ import type { LabelTrans, TopMenuItem } from '@/types'
|
||||
import type { NavigationMenuItem } from '@nuxt/ui'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import CountryCurrencySwitch from './inner/CountryCurrencySwitch.vue'
|
||||
import { settings } from '@/router/settings'
|
||||
|
||||
const authStore = useAuthStore()
|
||||
let menu = ref()
|
||||
|
||||
Reference in New Issue
Block a user