Merge pull request #281 from connorabbas/develop

Input id fixes

Author: connorabbas

resources/js/components/DeleteUserModal.vue

@@ -47,12 +47,12 @@ const deleteUser = () => {
 
         <div class="flex flex-col gap-2">
             <Password
-                id="password"
                 ref="password-input"
                 v-model="form.password"
                 :invalid="Boolean(form.errors?.password)"
                 :feedback="false"
                 autocomplete="current-password"
+                inputId="password"
                 toggleMask
                 autofocus
                 required

resources/js/pages/auth/Login.vue

@@ -77,11 +77,11 @@ onMounted(() => {
             <div class="flex flex-col gap-2">
                 <label for="password">Password</label>
                 <Password
-                    id="password"
                     v-model="loginForm.password"
                     :invalid="Boolean(loginForm.errors?.password)"
                     :feedback="false"
                     autocomplete="current-password"
+                    inputId="password"
                     toggleMask
                     required
                     fluid
@@ -100,9 +100,9 @@ onMounted(() => {
                 <div class="flex items-center justify-between">
                     <div class="flex items-center">
                         <Checkbox
-                            id="remember"
                             v-model="loginForm.remember"
                             class="mr-2"
+                            inputId="remember"
                             :binary="true"
                         />
                         <label for="remember">Remember me</label>

resources/js/pages/auth/Register.vue

@@ -77,10 +77,10 @@ onMounted(() => {
             <div class="flex flex-col gap-2">
                 <label for="password">Password</label>
                 <Password
-                    id="password"
                     v-model="registerForm.password"
                     :invalid="Boolean(registerForm.errors?.password)"
                     autocomplete="new-password"
+                    inputId="password"
                     toggleMask
                     required
                     fluid
@@ -96,13 +96,13 @@ onMounted(() => {
             </div>
 
             <div class="flex flex-col gap-2">
-                <label for="password_confirmation">Confirm Password</label>
+                <label for="password-confirmation">Confirm Password</label>
                 <Password
-                    id="password_confirmation"
                     v-model="registerForm.password_confirmation"
                     :invalid="Boolean(registerForm.errors?.password_confirmation)"
                     :feedback="false"
                     autocomplete="new-password"
+                    inputId="password-confirmation"
                     toggleMask
                     required
                     fluid

resources/js/pages/auth/ResetPassword.vue

@@ -67,10 +67,10 @@ onMounted(() => {
             <div class="flex flex-col gap-2">
                 <label for="password">New Password</label>
                 <Password
-                    id="password"
                     v-model="resetPwForm.password"
                     :invalid="Boolean(resetPwForm.errors?.password)"
                     autocomplete="new-password"
+                    inputId="password"
                     toggleMask
                     required
                     fluid
@@ -86,13 +86,13 @@ onMounted(() => {
             </div>
 
             <div class="flex flex-col gap-2">
-                <label for="password_confirmation">Confirm New Password</label>
+                <label for="password-confirmation">Confirm New Password</label>
                 <Password
-                    id="password_confirmation"
                     v-model="resetPwForm.password_confirmation"
                     :invalid="Boolean(resetPwForm.errors?.password_confirmation)"
-                    autocomplete="new-password"
                     :feedback="false"
+                    autocomplete="new-password"
+                    inputId="password-confirmation"
                     toggleMask
                     required
                     fluid

resources/js/pages/settings/Password.vue

@@ -81,14 +81,14 @@ const updatePassword = () => {
                         @submit.prevent="updatePassword"
                     >
                         <div class="flex flex-col gap-2">
-                            <label for="current_password">Current Password</label>
+                            <label for="current-password">Current Password</label>
                             <Password
-                                id="current_password"
                                 ref="current-password-input"
                                 v-model="updatePasswordForm.current_password"
                                 :invalid="Boolean(updatePasswordForm.errors?.current_password)"
-                                autocomplete="current-password"
                                 :feedback="false"
+                                autocomplete="current-password"
+                                inputId="current-password"
                                 toggleMask
                                 required
                                 fluid
@@ -105,11 +105,11 @@ const updatePassword = () => {
                         <div class="flex flex-col gap-2">
                             <label for="password">New Password</label>
                             <Password
-                                id="password"
                                 ref="new-password-input"
                                 v-model="updatePasswordForm.password"
                                 :invalid="Boolean(updatePasswordForm.errors?.password)"
                                 autocomplete="new-password"
+                                inputId="password"
                                 toggleMask
                                 required
                                 fluid
@@ -124,13 +124,13 @@ const updatePassword = () => {
                             </Message>
                         </div>
                         <div class="flex flex-col gap-2">
-                            <label for="password_confirmation">Confirm Password</label>
+                            <label for="password-confirmation">Confirm Password</label>
                             <Password
-                                id="password_confirmation"
                                 v-model="updatePasswordForm.password_confirmation"
                                 :invalid="Boolean(updatePasswordForm.errors?.password_confirmation)"
-                                autocomplete="confirm-password"
                                 :feedback="false"
+                                autocomplete="confirm-password"
+                                inputId="password-confirmation"
                                 toggleMask
                                 required
                                 fluid