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

Fix login modal positioning and increase logo size

Browse Source
This commit is contained in:
Ryderjj89
2025-10-01 17:34:25 -04:00
parent 89c75564cf
commit 7b834f4903
2 changed files with 54 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
assets/css/main.css
View File

@@ -17,9 +17,9 @@ html, body {
/* Logo sizing - CRITICAL FIX */ /* Logo sizing - CRITICAL FIX */
img[alt*="New Life Christian Church"] { img[alt*="New Life Christian Church"] {
height: 2rem !important; height: 3rem !important;
width: auto !important; width: auto !important;
max-height: 2rem !important; max-height: 3rem !important;
object-fit: contain; object-fit: contain;
} }
@@ -405,9 +405,9 @@ div[class*="modal-content"], [class*="modal-content"] {
/* Force logo to be small */ /* Force logo to be small */
img[src*="logo"], .logo-image { img[src*="logo"], .logo-image {
height: 2rem !important; height: 3rem !important;
width: auto !important; width: auto !important;
max-height: 2rem !important; max-height: 3rem !important;
object-fit: contain !important; object-fit: contain !important;
} }

98
components/LoginModal.vue
View File

@@ -1,56 +1,58 @@
<template> <template>
<UModal v-model="isOpen" :ui="{ width: 'sm:max-w-md' }"> <Teleport to="body">
<UCard> <UModal v-model="isOpen" :ui="{ width: 'sm:max-w-md' }">
<template #header> <UCard>
<h3 class="text-lg font-semibold text-gray-900">Admin Login</h3> <template #header>
</template> <h3 class="text-lg font-semibold text-gray-900">Admin Login</h3>
</template>
<form @submit.prevent="handleSubmit" class="space-y-4"> <form @submit.prevent="handleSubmit" class="space-y-4">
<UFormGroup label="Username" name="username"> <UFormGroup label="Username" name="username">
<UInput <UInput
v-model="form.username" v-model="form.username"
placeholder="Enter username" placeholder="Enter username"
:disabled="loading" :disabled="loading"
class="w-full" class="w-full"
/> />
</UFormGroup> </UFormGroup>
<UFormGroup label="Password" name="password"> <UFormGroup label="Password" name="password">
<UInput <UInput
v-model="form.password" v-model="form.password"
type="password" type="password"
placeholder="Enter password" placeholder="Enter password"
:disabled="loading" :disabled="loading"
class="w-full" class="w-full"
/> />
</UFormGroup> </UFormGroup>
<div v-if="error" class="text-red-600 text-sm p-3 bg-red-50 border border-red-200 rounded-md"> <div v-if="error" class="text-red-600 text-sm p-3 bg-red-50 border border-red-200 rounded-md">
{{ error }} {{ error }}
</div> </div>
<div class="flex justify-end space-x-3 pt-4"> <div class="flex justify-end space-x-3 pt-4">
<UButton <UButton
type="button" type="button"
variant="outline" variant="outline"
color="gray" color="gray"
:disabled="loading" :disabled="loading"
@click="close" @click="close"
> >
Cancel Cancel
</UButton> </UButton>
<UButton <UButton
type="submit" type="submit"
variant="solid" variant="solid"
color="primary" color="primary"
:loading="loading" :loading="loading"
> >
Login Login
</UButton> </UButton>
</div> </div>
</form> </form>
</UCard> </UCard>
</UModal> </UModal>
</Teleport>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">