Replaces maryUI and daisyUI with nonameweb/livewire-material: the Vibrant indigo scheme, a system/light/dark theme under sealshare-theme, one top app bar with the account menu, the upload drop zone and link-ready moments, M3 fields, dialogs instead of wire:confirm, snackbars instead of flashed messages, a sortable admin table, and the starter-kit cleanup. Docker builds assets after Composer; CI drops the Flux step. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
66 lines
2.5 KiB
PHP
66 lines
2.5 KiB
PHP
<x-layouts::auth :title="__('Two-factor authentication')">
|
|
<div
|
|
class="flex flex-col gap-6"
|
|
x-data="{
|
|
showRecoveryInput: @js($errors->has('recovery_code')),
|
|
toggleInput() {
|
|
this.showRecoveryInput = ! this.showRecoveryInput;
|
|
$nextTick(() => {
|
|
requestAnimationFrame(() => {
|
|
(this.showRecoveryInput ? $refs.recovery : $refs.code)?.querySelector('input')?.focus();
|
|
});
|
|
});
|
|
},
|
|
}"
|
|
>
|
|
<div x-show="! showRecoveryInput">
|
|
<x-auth-header
|
|
:title="__('Authentication Code')"
|
|
:description="__('Enter the authentication code provided by your authenticator application.')"
|
|
/>
|
|
</div>
|
|
|
|
<div x-show="showRecoveryInput" x-cloak>
|
|
<x-auth-header
|
|
:title="__('Recovery Code')"
|
|
:description="__('Please confirm access to your account by entering one of your emergency recovery codes.')"
|
|
/>
|
|
</div>
|
|
|
|
<form method="POST" action="{{ route('two-factor.login.store') }}" class="flex flex-col gap-5">
|
|
@csrf
|
|
|
|
<div x-ref="code" x-show="! showRecoveryInput">
|
|
<x-input
|
|
name="code"
|
|
:label="__('Code')"
|
|
inputmode="numeric"
|
|
autocomplete="one-time-code"
|
|
maxlength="6"
|
|
mono
|
|
autofocus
|
|
x-bind:disabled="showRecoveryInput"
|
|
/>
|
|
</div>
|
|
|
|
<div x-ref="recovery" x-show="showRecoveryInput" x-cloak>
|
|
<x-input
|
|
name="recovery_code"
|
|
:label="__('Recovery code')"
|
|
autocomplete="one-time-code"
|
|
mono
|
|
x-bind:disabled="! showRecoveryInput"
|
|
/>
|
|
</div>
|
|
|
|
<x-button type="submit" :label="__('Continue')" variant="filled" class="w-full" />
|
|
</form>
|
|
|
|
<p class="text-center type-body-md text-on-surface-variant">
|
|
{{ __('or you can') }}
|
|
<button type="button" class="link" x-show="! showRecoveryInput" x-on:click="toggleInput()">{{ __('login using a recovery code') }}</button>
|
|
<button type="button" class="link" x-show="showRecoveryInput" x-cloak x-on:click="toggleInput()">{{ __('login using an authentication code') }}</button>
|
|
</p>
|
|
</div>
|
|
</x-layouts::auth>
|