改进 密码验证页面

resources/views/auth/passwords/confirm.blade.php

@@ -1,30 +1,34 @@
 @extends('layouts.app')
 
 @section('content')
-    <h2>{{ __('Confirm Password') }}</h2>
-
-    {{ __('Please confirm your password before continuing.') }}
-
-    <form method="POST" action="{{ route('password.confirm') }}">
-        @csrf
-
-        <div class="form-group mt-3">
-            <label for="password" class="text-left ml-0">{{ __('Password') }}</label>
-            <input id="password" type="password"
-                   class="form-control @error('password') is-invalid @enderror" name="password"
-                   value="{{ old('password') }}" required autofocus placeholder="密码">
-
-            @error('password')
-            <span class="invalid-feedback" role="alert">
-                <strong>{{ $message }}</strong>
+    <div class="d-flex justify-content-center align-items-center h-screen" style="height:75vh">
+        <div class="text-center">
+            <span style="font-size: 10rem">
+                <i class="bi bi-key"></i>
             </span>
-            @enderror
+            <h2>{{ __('Confirm Password') }}</h2>
+            {{ __('Please confirm your password before continuing.') }}
+            <form method="POST" action="{{ route('password.confirm') }}">
+                @csrf
+
+                <div class="form-group mt-2">
+                    <input id="password" type="password"
+                           class="form-control text-center @error('password') is-invalid @enderror" name="password"
+                           value="{{ old('password') }}" required autofocus placeholder="密码" aria-label="密码">
+
+                    @error('password')
+                    <span class="invalid-feedback" role="alert">
+                        <strong>{{ $message }}</strong>
+                    </span>
+                    @enderror
+                </div>
+
+                <button class="btn btn-primary btn-block mt-3" type="submit">
+                    {{ __('Confirm Password') }}
+                </button>
+
+            </form>
         </div>
-
-        <button class="btn btn-primary btn-block mt-3" type="submit">
-            {{ __('Confirm Password') }}
-        </button>
-
-    </form>
+    </div>
 
 @endsection