RyderTech/nlcc-itinerary
1
0
Fork 0
Code Issues Pull Requests Packages Activity

Mobile layout adjustments

Browse Source
This commit is contained in:
Joshua Ryder
2025-10-06 17:32:01 -04:00
parent 966e244729
commit ab952e0334
1 changed files with 20 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
pages/index.vue
View File

@@ -5,29 +5,13 @@
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
<!-- Mobile Layout --> <!-- Mobile Layout -->
<div class="md:hidden"> <div class="md:hidden">
<div class="flex items-center justify-center mb-4"> <div class="flex items-center justify-between mb-3">
<img src="/logos/logo.png" alt="New Life Christian Church" class="h-16 w-auto" /> <img src="/logos/logo.png" alt="New Life Christian Church" class="h-12 w-auto" />
</div>
<div class="flex flex-wrap items-center justify-center gap-2">
<ClientOnly fallback-tag="div"> <ClientOnly fallback-tag="div">
<template v-if="isAuthenticated"> <template v-if="isAuthenticated">
<NuxtLink
v-if="isAdmin"
to="/admin"
class="px-3 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 font-medium text-xs whitespace-nowrap"
>
Manage Sermons
</NuxtLink>
<NuxtLink
v-if="isAdmin"
to="/users"
class="px-3 py-2 bg-green-600 text-white rounded-md hover:bg-green-700 font-medium text-xs whitespace-nowrap"
>
Manage Users
</NuxtLink>
<button <button
@click="handleLogout" @click="handleLogout"
class="px-3 py-2 text-xs font-medium text-blue-600 hover:text-blue-700" class="text-sm font-medium text-blue-600 hover:text-blue-700"
> >
Log Out Log Out
</button> </button>
@@ -35,12 +19,28 @@
<NuxtLink <NuxtLink
v-else v-else
to="/login" to="/login"
class="px-3 py-2 text-xs font-medium text-blue-600 hover:text-blue-700" class="text-sm font-medium text-blue-600 hover:text-blue-700"
> >
Log In Log In
</NuxtLink> </NuxtLink>
</ClientOnly> </ClientOnly>
</div> </div>
<ClientOnly fallback-tag="div">
<div v-if="isAuthenticated && isAdmin" class="flex flex-wrap items-center justify-center gap-2">
<NuxtLink
to="/admin"
class="px-3 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 font-medium text-xs whitespace-nowrap"
>
Manage Sermons
</NuxtLink>
<NuxtLink
to="/users"
class="px-3 py-2 bg-green-600 text-white rounded-md hover:bg-green-700 font-medium text-xs whitespace-nowrap"
>
Manage Users
</NuxtLink>
</div>
</ClientOnly>
</div> </div>
<!-- Desktop Layout --> <!-- Desktop Layout -->