local-it/vikunja-frontend
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

fix: top header still in foreground when menu is open

Browse source
This commit is contained in:
kolaente 2022-06-08 22:21:02 +02:00
parent dcb4e57768
commit a2c0696753
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B
1 changed files with 7 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/home/TheNavigation.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<header <header
:class="{'has-background': background}" :class="{'has-background': background, 'menu-active': menuActive}"
aria-label="main navigation" aria-label="main navigation"
class="navbar main-theme is-fixed-top d-print-none" class="navbar main-theme is-fixed-top d-print-none"
> >
@ -117,6 +117,7 @@ const background = computed(() => store.state.background)
const imprintUrl = computed(() => store.state.config.legal.imprintUrl) const imprintUrl = computed(() => store.state.config.legal.imprintUrl)
const privacyPolicyUrl = computed(() => store.state.config.legal.privacyPolicyUrl) const privacyPolicyUrl = computed(() => store.state.config.legal.privacyPolicyUrl)
const canWriteCurrentList = computed(() => store.state.currentList.maxRight > Rights.READ) const canWriteCurrentList = computed(() => store.state.currentList.maxRight > Rights.READ)
const menuActive = computed(() => store.state.menuActive)
const usernameDropdown = ref() const usernameDropdown = ref()
const listTitle = ref() const listTitle = ref()
@ -131,6 +132,7 @@ onMounted(async () => {
}) })
const router = useRouter() const router = useRouter()
function logout() { function logout() {
store.dispatch('auth/logout') store.dispatch('auth/logout')
router.push({name: 'user.login'}) router.push({name: 'user.login'})
@ -195,6 +197,10 @@ $hamburger-menu-icon-width: 28px;
} }
@media screen and (max-width: $tablet) { @media screen and (max-width: $tablet) {
&.menu-active {
z-index: 0;
}
.user { .user {
width: $user-dropdown-width-mobile; width: $user-dropdown-width-mobile;