Changed standard HTML tags with flux tags (#26)

* Changed standard html tags with flux tags

* Added font-medium

* Removed gap between heading and subheading

* Using headings to make text white in split auth layout

* Added more margin top to email field note

---------

Co-authored-by: Taylor Otwell <[email protected]>

Author: realpoke

resources/views/components/auth-header.blade.php

@@ -3,7 +3,7 @@
     'description',
 ])
 
-<div class="flex w-full flex-col gap-2 text-center">
-    <h1 class="text-xl font-medium dark:text-zinc-200">{{ $title }}</h1>
-    <p class="text-center text-sm dark:text-zinc-400">{{ $description }}</p>
+<div class="flex w-full flex-col text-center">
+    <flux:heading size="xl">{{ $title }}</flux:heading>
+    <flux:subheading>{{ $description }}</flux:subheading>
 </div>

resources/views/components/layouts/auth/split.blade.php

@@ -20,8 +20,8 @@
 
                 <div class="relative z-20 mt-auto">
                     <blockquote class="space-y-2">
-                        <p class="text-lg">&ldquo;{{ trim($message) }}&rdquo;</p>
-                        <footer class="text-sm">{{ trim($author) }}</footer>
+                        <flux:heading size="lg">&ldquo;{{ trim($message) }}&rdquo;</flux:heading>
+                        <footer><flux:heading>{{ trim($author) }}</flux:heading></footer>
                     </blockquote>
                 </div>
             </div>

resources/views/livewire/auth/verify-email.blade.php

@@ -35,14 +35,14 @@ public function logout(Logout $logout): void
 }; ?>
 
 <div class="mt-4 flex flex-col gap-6">
-    <div class="text-center text-sm text-gray-600">
+    <flux:text class="text-center">
         {{ __('Please verify your email address by clicking on the link we just emailed to you.') }}
-    </div>
+    </flux:text>
 
     @if (session('status') == 'verification-link-sent')
-        <div class="font-medium text-center text-sm text-green-600">
+        <flux:text class="text-center font-medium !dark:text-green-400 !text-green-600">
             {{ __('A new verification link has been sent to the email address you provided during registration.') }}
-        </div>
+        </flux:text>
     @endif
 
     <div class="flex flex-col items-center justify-between space-y-3">

resources/views/livewire/settings/profile.blade.php

@@ -81,18 +81,18 @@ public function resendVerificationNotification(): void
 
                 @if (auth()->user() instanceof \Illuminate\Contracts\Auth\MustVerifyEmail &&! auth()->user()->hasVerifiedEmail())
                     <div>
-                        <p class="mt-2 text-sm text-gray-800">
+                        <flux:text class="mt-4">
                             {{ __('Your email address is unverified.') }}
 
                             <flux:link class="text-sm cursor-pointer" wire:click.prevent="resendVerificationNotification">
                                 {{ __('Click here to re-send the verification email.') }}
                             </flux:link>
-                        </p>
+                        </flux:text>
 
                         @if (session('status') === 'verification-link-sent')
-                            <p class="mt-2 text-sm font-medium text-green-600">
+                            <flux:text class="mt-2 font-medium !dark:text-green-400 !text-green-600">
                                 {{ __('A new verification link has been sent to your email address.') }}
-                            </p>
+                            </flux:text>
                         @endif
                     </div>
                 @endif