Skip to content

Commit

Permalink
Fix mobile menu button
Browse files Browse the repository at this point in the history
  • Loading branch information
jlpereira committed Apr 18, 2023
1 parent 2c17242 commit 42780f4
Showing 1 changed file with 13 additions and 27 deletions.
40 changes: 13 additions & 27 deletions src/components/Navbar/NavbarMobile.vue
Original file line number Diff line number Diff line change
@@ -1,40 +1,23 @@
<template>
<button
type="button"
class="
inline-flex
items-center
p-2 z-50
ml-3
text-sm
text-primary-content
rounded-lg
md:hidden
print:hidden"
class="inline-flex items-center p-2 z-50 ml-3 text-sm text-primary-content rounded-lg md:hidden print:hidden"
aria-controls="mobile-menu"
aria-expanded="false"
@click="toggleMenu"
>
<span class="sr-only">Open main menu</span>
<IconClose v-if="isMenuVisible" />
<IconHamburger v-else />
<IconHamburger
class="w-6 h-6"
v-else
/>
</button>

<AnimationOpacity>
<div
v-if="isMenuVisible"
class="
absolute
top-full
left-0
w-full
z-50
bg-base-foreground
text-base-content
block
shadow-md
md:hidden
print:hidden"
class="absolute top-full left-0 w-full z-50 bg-base-foreground text-base-content block shadow-md md:hidden print:hidden"
>
<nav class="font-normal container mx-auto">
<ul class="flex flex-col m-0 p-0 border-t border-base-border">
Expand All @@ -51,7 +34,9 @@
</router-link>
</li>
<li>
<SwitchTheme class="text-base-content p-4 pt-3 pb-3 border-b w-full border-base-border" />
<SwitchTheme
class="text-base-content w-full p-4 pt-3 pb-3 block box-border border-b border-b-base-border"
/>
</li>
</ul>
</nav>
Expand All @@ -66,6 +51,7 @@ import SwitchTheme from '../SwitchTheme.vue'
const { header_links } = __APP_ENV__
const isMenuVisible = ref(false)
const toggleMenu = () => { isMenuVisible.value = !isMenuVisible.value }
</script>
const toggleMenu = () => {
isMenuVisible.value = !isMenuVisible.value
}
</script>

0 comments on commit 42780f4

Please sign in to comment.