chore: change registration mechanisms (#7201)

Author: djaiss

app/Http/Controllers/Auth/AcceptInvitationController.php

@@ -9,7 +9,7 @@
 use Illuminate\Database\Eloquent\ModelNotFoundException;
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Auth;
-use Illuminate\Validation\Rules;
+use Illuminate\Validation\Rules\Password;
 use Inertia\Inertia;
 
 class AcceptInvitationController extends Controller
@@ -35,7 +35,7 @@ public function store(Request $request)
             'invitation_code' => 'required|uuid',
             'first_name' => 'required|string|max:255',
             'last_name' => 'required|string|max:255',
-            'password' => ['required', 'confirmed', Rules\Password::defaults()],
+            'password' => ['required', 'confirmed', Password::min(8)->uncompromised()],
         ]);
 
         $data = [

resources/js/Pages/Auth/Login.vue

@@ -94,7 +94,7 @@ const reload = () => {
     </div>
 
     <div
-      class="mt-6 flex w-full flex-col overflow-hidden bg-white shadow-md dark:bg-gray-800 sm:max-w-4xl sm:rounded-lg md:flex-row">
+      class="mt-6 mb-12 flex w-full flex-col overflow-hidden bg-white shadow-md dark:bg-gray-800 sm:max-w-4xl sm:rounded-lg md:flex-row">
       <img :src="wallpaperUrl" class="w-full sm:invisible sm:w-10/12 md:visible" :alt="$t('Wallpaper')" />
       <div class="w-full">
         <div class="border-b border-gray-200 px-6 pb-6 pt-8 dark:border-gray-700">

resources/js/Pages/Auth/Register.vue

@@ -87,9 +87,10 @@ const policy = () => {
           id="password"
           v-model="form.password"
           type="password"
-          class="mt-1 block w-full"
+          class="mt-1 mb-1 block w-full"
           required
           autocomplete="new-password" />
+        <p class="text-xs text-gray-600">{{ $t('The password should be at least 8 characters long.') }}</p>
       </div>
 
       <div class="mb-8 mt-4">

resources/js/Shared/Guest.vue

@@ -11,7 +11,8 @@ import ApplicationLogo from '@/Components/ApplicationLogo.vue';
       </Link>
     </div>
 
-    <div class="mt-6 w-full overflow-hidden bg-white px-6 py-6 shadow-md dark:bg-gray-900 sm:max-w-md sm:rounded-lg">
+    <div
+      class="mt-6 mb-12 w-full overflow-hidden bg-white px-6 py-6 shadow-md dark:bg-gray-900 sm:max-w-md sm:rounded-lg">
       <slot />
     </div>
   </div>