update to say Atitlan Lightning Directory and format

This commit is contained in:
padreug 2025-02-02 18:57:38 +01:00
parent 27173b11eb
commit 9f0d440288

View file

@ -25,23 +25,18 @@ const toggleMenu = () => {
<div class="flex flex-shrink-0 items-center"> <div class="flex flex-shrink-0 items-center">
<!-- Replace with your logo --> <!-- Replace with your logo -->
<router-link to="/" class="text-xl font-bold text-card-foreground"> <router-link to="/" class="text-xl font-bold text-card-foreground">
Lightning Directory Atitlan Lightning Directory
</router-link> </router-link>
</div> </div>
<!-- Desktop Navigation --> <!-- Desktop Navigation -->
<div class="hidden sm:ml-6 sm:flex sm:space-x-8"> <div class="hidden sm:ml-6 sm:flex sm:space-x-8">
<router-link <router-link v-for="item in navigation" :key="item.name" :to="item.href"
v-for="item in navigation" class="inline-flex items-center px-1 pt-1 text-sm font-medium" :class="[
:key="item.name"
:to="item.href"
class="inline-flex items-center px-1 pt-1 text-sm font-medium"
:class="[
$route.path === item.href $route.path === item.href
? 'border-b-2 border-primary text-card-foreground' ? 'border-b-2 border-primary text-card-foreground'
: 'text-muted-foreground hover:border-b-2 hover:border-muted hover:text-card-foreground' : 'text-muted-foreground hover:border-b-2 hover:border-muted hover:text-card-foreground'
]" ]">
>
{{ item.name }} {{ item.name }}
</router-link> </router-link>
</div> </div>
@ -54,11 +49,9 @@ const toggleMenu = () => {
<!-- Mobile menu button --> <!-- Mobile menu button -->
<div class="flex items-center sm:hidden"> <div class="flex items-center sm:hidden">
<button <button type="button"
type="button"
class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500" class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-100 hover:text-gray-500"
@click="toggleMenu" @click="toggleMenu">
>
<span class="sr-only">Open main menu</span> <span class="sr-only">Open main menu</span>
<Menu v-if="!isOpen" class="block h-6 w-6" aria-hidden="true" /> <Menu v-if="!isOpen" class="block h-6 w-6" aria-hidden="true" />
<X v-else class="block h-6 w-6" aria-hidden="true" /> <X v-else class="block h-6 w-6" aria-hidden="true" />
@ -68,26 +61,17 @@ const toggleMenu = () => {
</div> </div>
<!-- Mobile menu --> <!-- Mobile menu -->
<div <div :class="[isOpen ? 'block' : 'hidden']" class="sm:hidden">
:class="[isOpen ? 'block' : 'hidden']"
class="sm:hidden"
>
<div class="space-y-1 pb-3 pt-2"> <div class="space-y-1 pb-3 pt-2">
<router-link <router-link v-for="item in navigation" :key="item.name" :to="item.href"
v-for="item in navigation" class="block border-l-4 py-2 pl-3 pr-4 text-base font-medium" :class="[
:key="item.name"
:to="item.href"
class="block border-l-4 py-2 pl-3 pr-4 text-base font-medium"
:class="[
$route.path === item.href $route.path === item.href
? 'border-primary bg-primary/10 text-primary' ? 'border-primary bg-primary/10 text-primary'
: 'border-transparent text-gray-500 hover:border-gray-300 hover:bg-gray-50 hover:text-gray-700' : 'border-transparent text-gray-500 hover:border-gray-300 hover:bg-gray-50 hover:text-gray-700'
]" ]" @click="isOpen = false">
@click="isOpen = false"
>
{{ item.name }} {{ item.name }}
</router-link> </router-link>
</div> </div>
</div> </div>
</nav> </nav>
</template> </template>