diff --git a/resources/js/Layouts/Admin/Partials/DrawerMenu.vue b/resources/js/Layouts/Admin/Partials/DrawerMenu.vue
index 841c011a..7b6ffeed 100644
--- a/resources/js/Layouts/Admin/Partials/DrawerMenu.vue
+++ b/resources/js/Layouts/Admin/Partials/DrawerMenu.vue
@@ -56,7 +56,7 @@ const exampleNestedMenuItems = ref([
                 icon: 'pi pi-cloud-upload',
                 command: () => {
                     alert('Example using programmatic functionality');
-                }
+                },
             },
             {
                 label: 'Download',
@@ -72,26 +72,20 @@ const exampleNestedMenuItems = ref([
 </script>
 
 <template>
-    <Drawer
-        v-model:visible="visible"
-        position="left"
-        :autoZIndex="false"
-    >
-        <div>
-            <div class="mb-5">
-                <p class="text-muted-color font-bold uppercase text-sm mb-2">
-                    Home
-                </p>
+    <Drawer v-model:visible="visible" position="left" :autoZIndex="false">
+        <div class="space-y-5">
+            <div class="space-y-2">
+                <p class="text-muted-color font-bold uppercase text-sm">Home</p>
                 <LinksPanelMenu :model="homeMenuItems" class="w-full" />
             </div>
-            <div class="mb-5">
-                <p class="text-muted-color font-bold uppercase text-sm mb-2">
+            <div class="space-y-2">
+                <p class="text-muted-color font-bold uppercase text-sm">
                     Analytics
                 </p>
                 <LinksPanelMenu :model="analyticsMenuItems" class="w-full" />
             </div>
-            <div class="mb-5">
-                <p class="text-muted-color font-bold uppercase text-sm mb-2">
+            <div class="space-y-2">
+                <p class="text-muted-color font-bold uppercase text-sm">
                     Example Nested
                 </p>
                 <LinksPanelMenu
diff --git a/resources/js/Layouts/Admin/Partials/SideMenuItems.vue b/resources/js/Layouts/Admin/Partials/SideMenuItems.vue
index 9215ef66..6f1d4598 100644
--- a/resources/js/Layouts/Admin/Partials/SideMenuItems.vue
+++ b/resources/js/Layouts/Admin/Partials/SideMenuItems.vue
@@ -67,21 +67,19 @@ const exampleNestedMenuItems = [
 </script>
 
 <template>
-    <div class="h-full">
-        <div class="mb-5">
-            <p class="text-muted-color font-bold uppercase text-sm mb-2">
-                Home
-            </p>
+    <div class="h-full space-y-5">
+        <div class="space-y-2">
+            <p class="text-muted-color font-bold uppercase text-sm">Home</p>
             <LinksPanelMenu :model="homeMenuItems" class="w-full" />
         </div>
-        <div class="mb-5">
-            <p class="text-muted-color font-bold uppercase text-sm mb-2">
+        <div class="space-y-2">
+            <p class="text-muted-color font-bold uppercase text-sm">
                 Analytics
             </p>
             <LinksPanelMenu :model="analyticsMenuItems" class="w-full" />
         </div>
-        <div class="mb-5">
-            <p class="text-muted-color font-bold uppercase text-sm mb-2">
+        <div class="space-y-2">
+            <p class="text-muted-color font-bold uppercase text-sm">
                 Example Nested
             </p>
             <LinksPanelMenu :model="exampleNestedMenuItems" class="w-full" />
diff --git a/resources/js/Layouts/Admin/Partials/TopNav.vue b/resources/js/Layouts/Admin/Partials/TopNav.vue
index e07ecbf8..558b5112 100644
--- a/resources/js/Layouts/Admin/Partials/TopNav.vue
+++ b/resources/js/Layouts/Admin/Partials/TopNav.vue
@@ -71,8 +71,8 @@ const toggleUserMenu = (event) => {
                     <div class="flex items-center space-x-3">
                         <div>
                             <ToggleDarkModeButton
-                                text
                                 severity="secondary"
+                                text
                                 rounded
                             />
                         </div>
diff --git a/resources/js/Layouts/AuthenticatedLayout.vue b/resources/js/Layouts/AuthenticatedLayout.vue
index 2cead9b3..78bbbe94 100644
--- a/resources/js/Layouts/AuthenticatedLayout.vue
+++ b/resources/js/Layouts/AuthenticatedLayout.vue
@@ -111,8 +111,8 @@ watchEffect(() => {
                             >
                                 <div>
                                     <ToggleDarkModeButton
-                                        text
                                         severity="secondary"
+                                        text
                                         rounded
                                     />
                                 </div>
@@ -168,13 +168,17 @@ watchEffect(() => {
                 <!-- Mobile drawer menu -->
                 <Drawer v-model:visible="mobileMenuOpen" position="right">
                     <template #header>
-                        <ToggleDarkModeButton text severity="secondary" rounded />
+                        <ToggleDarkModeButton
+                            severity="secondary"
+                            text
+                            rounded
+                        />
                     </template>
                     <div>
-                        <div>
-                            <div class="mb-5">
+                        <div class="space-y-5">
+                            <div class="space-y-2">
                                 <p
-                                    class="text-muted-color font-bold uppercase text-sm mb-2"
+                                    class="text-muted-color font-bold uppercase text-sm"
                                 >
                                     Home
                                 </p>
diff --git a/resources/js/Pages/Admin/Profile/Edit.vue b/resources/js/Pages/Admin/Profile/Edit.vue
index 29891c20..9d80eda5 100644
--- a/resources/js/Pages/Admin/Profile/Edit.vue
+++ b/resources/js/Pages/Admin/Profile/Edit.vue
@@ -24,7 +24,7 @@ const breadcrumbs = [
 <template>
     <Head :title="pageTitle" />
 
-    <AdminAuthenticatedLayout
+    <AuthenticatedAdminLayout
         :page-title="pageTitle"
         :breadcrumbs="breadcrumbs"
     >
@@ -96,5 +96,5 @@ const breadcrumbs = [
                 </Card>
             </div>
         </Container>
-    </AdminAuthenticatedLayout>
+    </AuthenticatedAdminLayout>
 </template>
diff --git a/resources/js/Pages/Admin/Profile/Partials/DeleteUserForm.vue b/resources/js/Pages/Admin/Profile/Partials/DeleteUserForm.vue
index 756d2bc5..d9ec2a30 100644
--- a/resources/js/Pages/Admin/Profile/Partials/DeleteUserForm.vue
+++ b/resources/js/Pages/Admin/Profile/Partials/DeleteUserForm.vue
@@ -28,6 +28,7 @@ function focusPasswordInput() {
         <Dialog
             v-model:visible="modalOpen"
             :draggable="false"
+            :dismissableMask="true"
             position="center"
             modal
             header="Are you sure you want to delete your account?"
diff --git a/resources/js/Pages/Admin/Users/Index.vue b/resources/js/Pages/Admin/Users/Index.vue
index bcbb1e70..41dd6b09 100644
--- a/resources/js/Pages/Admin/Users/Index.vue
+++ b/resources/js/Pages/Admin/Users/Index.vue
@@ -87,12 +87,12 @@ const {
                         />
                         <DataTable
                             ref="dataTable"
+                            v-model:filters="filters"
                             lazy
                             paginator
                             removableSort
                             resizableColumns
                             columnResizeMode="fit"
-                            v-model:filters="filters"
                             :loading="processing"
                             :value="users.data"
                             :totalRecords="users.total"
diff --git a/resources/js/Pages/Profile/Partials/DeleteUserForm.vue b/resources/js/Pages/Profile/Partials/DeleteUserForm.vue
index e748b605..0cd18512 100644
--- a/resources/js/Pages/Profile/Partials/DeleteUserForm.vue
+++ b/resources/js/Pages/Profile/Partials/DeleteUserForm.vue
@@ -28,6 +28,7 @@ function focusPasswordInput() {
         <Dialog
             v-model:visible="modalOpen"
             :draggable="false"
+            :dismissableMask="true"
             position="center"
             modal
             header="Are you sure you want to delete your account?"