Add SealShare file sharing application with encryption, branding, auth, Docker, and Octane support

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

resources/views/pages/settings/two-factor/⚡recovery-codes.blade.php

@@ -46,55 +46,46 @@ new class extends Component {
 }; ?>
 
 <div
-    class="py-6 space-y-6 border shadow-sm rounded-xl border-zinc-200 dark:border-white/10"
+    class="py-6 space-y-6 border shadow-sm rounded-xl border-base-300"
     wire:cloak
     x-data="{ showRecoveryCodes: false }"
 >
     <div class="px-6 space-y-2">
         <div class="flex items-center gap-2">
-            <flux:icon.lock-closed variant="outline" class="size-4"/>
-            <flux:heading size="lg" level="3">{{ __('2FA Recovery Codes') }}</flux:heading>
+            <x-icon name="o-lock-closed" class="w-4 h-4" />
+            <h3 class="text-lg font-semibold">{{ __('2FA Recovery Codes') }}</h3>
         </div>
-        <flux:text variant="subtle">
+        <p class="text-sm opacity-60">
             {{ __('Recovery codes let you regain access if you lose your 2FA device. Store them in a secure password manager.') }}
-        </flux:text>
+        </p>
     </div>
 
     <div class="px-6">
         <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
-            <flux:button
+            <x-button
                 x-show="!showRecoveryCodes"
-                icon="eye"
-                icon:variant="outline"
-                variant="primary"
+                icon="o-eye"
+                label="{{ __('View Recovery Codes') }}"
+                class="btn-primary btn-sm"
                 @click="showRecoveryCodes = true;"
-                aria-expanded="false"
-                aria-controls="recovery-codes-section"
-            >
-                {{ __('View Recovery Codes') }}
-            </flux:button>
+            />
 
-            <flux:button
+            <x-button
                 x-show="showRecoveryCodes"
-                icon="eye-slash"
-                icon:variant="outline"
-                variant="primary"
+                icon="o-eye-slash"
+                label="{{ __('Hide Recovery Codes') }}"
+                class="btn-primary btn-sm"
                 @click="showRecoveryCodes = false"
-                aria-expanded="true"
-                aria-controls="recovery-codes-section"
-            >
-                {{ __('Hide Recovery Codes') }}
-            </flux:button>
+            />
 
             @if (filled($recoveryCodes))
-                <flux:button
+                <x-button
                     x-show="showRecoveryCodes"
-                    icon="arrow-path"
-                    variant="filled"
+                    icon="o-arrow-path"
+                    label="{{ __('Regenerate Codes') }}"
+                    class="btn-sm"
                     wire:click="regenerateRecoveryCodes"
-                >
-                    {{ __('Regenerate Codes') }}
-                </flux:button>
+                />
             @endif
         </div>
 
@@ -107,12 +98,12 @@ new class extends Component {
         >
             <div class="mt-3 space-y-3">
                 @error('recoveryCodes')
-                    <flux:callout variant="danger" icon="x-circle" heading="{{$message}}"/>
+                    <div class="alert alert-error">{{ $message }}</div>
                 @enderror
 
                 @if (filled($recoveryCodes))
                     <div
-                        class="grid gap-1 p-4 font-mono text-sm rounded-lg bg-zinc-100 dark:bg-white/5"
+                        class="grid gap-1 p-4 font-mono text-sm rounded-lg bg-base-200"
                         role="list"
                         aria-label="{{ __('Recovery codes') }}"
                     >
@@ -126,9 +117,9 @@ new class extends Component {
                             </div>
                         @endforeach
                     </div>
-                    <flux:text variant="subtle" class="text-xs">
+                    <p class="text-xs opacity-60">
                         {{ __('Each recovery code can be used once to access your account and will be removed after use. If you need more, click Regenerate Codes above.') }}
-                    </flux:text>
+                    </p>
                 @endif
             </div>
         </div>