UA-Fediland/pixelfed
2
0
Fork 0
mirror of https://github.com/pixelfed/pixelfed.git synced 2025-02-02 18:00:47 +00:00
Code Issues Projects Releases Packages Wiki Activity

Add form

Browse source
This commit is contained in:
Daniel Supernault 2025-01-31 00:43:44 -07:00
parent 604746bd5e
commit 1d86bff3f2
No known key found for this signature in database
GPG key ID: 23740873EE6F76A1
1 changed files with 156 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

156
resources/views/auth/iar.blade.php Normal file
View file

@ -0,0 +1,156 @@
@extends('layouts.blank')
@section('content')
<div class="container">
<div class="row min-vh-100 align-items-center justify-content-center">
<div class="col-12 col-md-6 col-lg-5">
<div class="text-center mb-5">
<img src="/img/pixelfed-icon-white.svg" width="90">
</div>
<div class="card shadow-sm">
<div class="card-body p-4">
<h2 class="text-center">Join Pixelfed</h2>
<p class="lead text-center mb-4">Enter Your Email</p>
@if ($errors->any())
<div class="alert alert-danger">
<ul class="mb-0">
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<form method="POST">
@csrf
<div class="form-group">
<label for="email">Email address</label>
<input type="email"
class="form-control @error('email') is-invalid @enderror"
id="email"
name="email"
required
autocomplete="email">
@error('email')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
<div class="form-group text-center">
{!! Captcha::display() !!}
</div>
<button type="submit" class="btn btn-primary btn-block">
Send Verification Code
</button>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
@push('styles')
<style>
:root {
--bg-color: #f8f9fa;
--card-bg: #ffffff;
--text-color: #212529;
--text-muted: #6c757d;
--input-bg: #ffffff;
--input-border: #ced4da;
--input-focus: #80bdff;
--card-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
@media (prefers-color-scheme: dark) {
:root {
--bg-color: #111827;
--card-bg: #1f2937;
--text-color: #f3f4f6;
--text-muted: #9ca3af;
--input-bg: #374151;
--input-border: #4b5563;
--input-focus: #3b82f6;
--card-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
}
}
body {
background-color: var(--bg-color);
color: var(--text-color);
transition: background-color 0.3s, color 0.3s;
min-height: 100vh;
display: flex;
align-items: center;
}
.card {
background-color: var(--card-bg);
border: none;
border-radius: 1rem;
box-shadow: var(--card-shadow);
}
.benefits-list {
color: var(--text-muted);
}
.benefits-list i {
color: #3b82f6;
margin-right: 0.5rem;
}
.form-control {
background-color: var(--input-bg);
border-color: var(--input-border);
color: var(--text-color);
border-radius: 0.5rem;
padding: 0.75rem 1rem;
transition: all 0.2s;
}
.form-control:focus {
background-color: var(--input-bg);
border-color: var(--input-focus);
color: var(--text-color);
box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25);
}
.btn-primary {
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
font-weight: 500;
transition: transform 0.2s;
background-color: #3b82f6;
border-color: #3b82f6;
}
.btn-primary:hover {
transform: translateY(-1px);
background-color: #2563eb;
border-color: #2563eb;
}
.form-group label {
font-weight: 500;
margin-bottom: 0.5rem;
}
@media (prefers-color-scheme: dark) {
a {
color: #60a5fa;
}
a:hover {
color: #93c5fd;
}
.card {
border: 1px solid rgba(255, 255, 255, 0.1);
}
}
</style>
@endpush