mad-lawsuit/resources/js/Pages/Admin/Login.vue
TheMaddax b7125cf2b7 Phase 4: Production deployment configuration
- Add Docker configuration (Dockerfile, docker-compose.yml)
- Add Nginx and Supervisor configuration
- Add deployment documentation (DEPLOYMENT.md)
- Complete Phase 3 data migration (63 entries, 63 docs, 28 subs)
- Add responsive PDF viewer component
- Fix date format to American (MM/DD/YYYY)
- Update typography to match v1.0
- Add admin dashboard with full CRUD operations
- Configure PostgreSQL with secure password
- Connect to caddy_network for reverse proxy
- Ready for production deployment
2025-12-17 19:12:32 -07:00

90 lines
3.2 KiB
Vue

<script setup lang="ts">
import { ref } from 'vue';
import { useForm } from '@inertiajs/vue3';
import InputError from '@/Components/InputError.vue';
import InputLabel from '@/Components/InputLabel.vue';
import PrimaryButton from '@/Components/PrimaryButton.vue';
import TextInput from '@/Components/TextInput.vue';
const form = useForm({
username: '',
password: '',
});
const submit = () => {
form.post(route('admin.login'), {
onFinish: () => form.reset('password'),
});
};
</script>
<template>
<div class="min-h-screen flex items-center justify-center bg-gradient-to-br from-gray-900 via-gray-800 to-gray-900">
<div class="w-full max-w-md">
<!-- Header -->
<div class="text-center mb-8">
<h1 class="text-3xl font-bold text-white mb-2">
Admin Login
</h1>
<p class="text-gray-400">
Eliza Kragh v. Montana Association of the Deaf
</p>
</div>
<!-- Login Card -->
<div class="bg-white rounded-lg shadow-xl p-8">
<form @submit.prevent="submit">
<!-- Username -->
<div class="mb-4">
<InputLabel for="username" value="Username" />
<TextInput
id="username"
type="text"
class="mt-1 block w-full"
v-model="form.username"
required
autofocus
autocomplete="username"
/>
<InputError class="mt-2" :message="form.errors.username" />
</div>
<!-- Password -->
<div class="mb-6">
<InputLabel for="password" value="Password" />
<TextInput
id="password"
type="password"
class="mt-1 block w-full"
v-model="form.password"
required
autocomplete="current-password"
/>
<InputError class="mt-2" :message="form.errors.password" />
</div>
<!-- Submit Button -->
<div class="flex items-center justify-end">
<PrimaryButton
class="w-full justify-center"
:class="{ 'opacity-25': form.processing }"
:disabled="form.processing"
>
Log in
</PrimaryButton>
</div>
</form>
</div>
<!-- Footer -->
<div class="text-center mt-6">
<a
href="/"
class="text-sm text-gray-400 hover:text-white transition-colors"
>
Back to Public Site
</a>
</div>
</div>
</div>
</template>