lolispace-applications/resources/views/livewire/application-form.blade.php

38 lines
1.9 KiB
PHP

<div class="max-w-2xl w-full md:w-xl mx-auto mt-10 flex flex-col gap-6">
<form wire:submit.prevent="submit" enctype="multipart/form-data">
<div class="flex flex-col gap-4 mb-6">
<flux:callout variant="secondary" icon="information-circle" heading="Here you can submit your application."
text="To apply, simply fill out the form below and upload at least one loli photo.
After submitting, you'll receive a unique link — make sure to save it! You can use that
link to check the status of your application, and if everything is approved, you'll also
receive your registration token there." />
<flux:textarea wire:model="message" label="Why do you want to join? (max. 500 characters)"
placeholder="Cunny 😭" />
<flux:input type="file" wire:model="photos" label="Loli Photos (max. 6 files, max. 8MB per file)"
multiple />
@if ($photos)
<div class="mt-4">
<flux:heading>Photo Preview</flux:heading>
<div class="flex gap-4 mt-2">
@foreach ($photos as $photo)
<img src="{{ $photo->temporaryUrl() }}" class="w-24 h-24 object-cover rounded">
@endforeach
</div>
</div>
@endif
<div class="mt-4">
<div class="flex">
<flux:input label="Captcha" wire:model.defer="captchaInput" />
<img src="{{ $captcha }}" alt="captcha" wire:click="refreshCaptcha"
class="cursor-pointer ml-3 mt-7 h-10 rounded-lg">
</div>
</div>
</div>
<flux:button class="w-full" variant="primary" wire:click="submit">Submit Application</flux:button>
</form>
</div>