From c4f902b46928df0bf2840d35bb0a8dd0ec20cd56 Mon Sep 17 00:00:00 2001
From: haex <hexxx@ok.de>
Date: Tue, 17 Jun 2025 22:24:13 +0200
Subject: [PATCH] cleanup

---
 src/components/haex/pass/group/index.vue      | 100 ++++-----
 src/components/haex/pass/item/index.vue       | 206 +++++++++---------
 .../haex/pass/mobile/menu/index.vue           |   2 +-
 src/pages/vault/[vaultId]/index.vue           |  15 +-
 .../[vaultId]/passwords/[[groupId]]/edit.vue  |   1 -
 .../[vaultId]/passwords/[[groupId]]/index.vue |  15 +-
 6 files changed, 169 insertions(+), 170 deletions(-)

diff --git a/src/components/haex/pass/group/index.vue b/src/components/haex/pass/group/index.vue
index f9c3492..8e6d788 100644
--- a/src/components/haex/pass/group/index.vue
+++ b/src/components/haex/pass/group/index.vue
@@ -1,58 +1,60 @@
 <template>
-  <UiCard
-    v-if="group"
-    :title="mode === 'create' ? t('title.create') : t('title.edit')"
-    icon="mdi:folder-plus-outline"
-    @close="$emit('close')"
-  >
-    <form
-      class="flex flex-col gap-4 w-full p-4"
-      @submit.prevent="$emit('submit')"
+  <div class="p-1">
+    <UiCard
+      v-if="group"
+      :title="mode === 'create' ? t('title.create') : t('title.edit')"
+      icon="mdi:folder-plus-outline"
+      @close="$emit('close')"
     >
-      <UiInput
-        :check-input="check"
-        :label="t('name')"
-        :placeholder="t('name')"
-        autofocus
-        v-model="group.name"
-        ref="nameRef"
-      />
-
-      <UiInput
-        v-model="group.description"
-        :check-input="check"
-        :label="t('description')"
-        :placeholder="t('description')"
-      />
-
-      <div class="flex gap-4">
-        <UiSelectIcon
-          v-model="group.icon"
-          default-icon="mdi:folder-outline"
+      <form
+        class="flex flex-col gap-4 w-full p-4"
+        @submit.prevent="$emit('submit')"
+      >
+        <UiInput
+          :check-input="check"
+          :label="t('name')"
+          :placeholder="t('name')"
+          autofocus
+          v-model="group.name"
+          ref="nameRef"
         />
 
-        <UiSelectColor v-model="group.color" />
-      </div>
+        <UiInput
+          v-model="group.description"
+          :check-input="check"
+          :label="t('description')"
+          :placeholder="t('description')"
+        />
 
-      <div class="flex flex-wrap justify-end gap-4">
-        <UiButton
-          class="btn-error btn-outline flex-1"
-          @click="$emit('close')"
-        >
-          {{ t('abort') }}
-          <Icon name="mdi:close" />
-        </UiButton>
+        <div class="flex gap-4">
+          <UiSelectIcon
+            v-model="group.icon"
+            default-icon="mdi:folder-outline"
+          />
 
-        <UiButton
-          class="btn-primary flex-1"
-          @click="$emit('submit')"
-        >
-          {{ mode === 'create' ? t('create') : t('save') }}
-          <Icon name="mdi:check" />
-        </UiButton>
-      </div>
-    </form>
-  </UiCard>
+          <UiSelectColor v-model="group.color" />
+        </div>
+
+        <div class="flex flex-wrap justify-end gap-4">
+          <UiButton
+            class="btn-error btn-outline flex-1"
+            @click="$emit('close')"
+          >
+            {{ t('abort') }}
+            <Icon name="mdi:close" />
+          </UiButton>
+
+          <UiButton
+            class="btn-primary flex-1"
+            @click="$emit('submit')"
+          >
+            {{ mode === 'create' ? t('create') : t('save') }}
+            <Icon name="mdi:check" />
+          </UiButton>
+        </div>
+      </form>
+    </UiCard>
+  </div>
 </template>
 
 <script setup lang="ts">
diff --git a/src/components/haex/pass/item/index.vue b/src/components/haex/pass/item/index.vue
index 6badadc..967bd19 100644
--- a/src/components/haex/pass/item/index.vue
+++ b/src/components/haex/pass/item/index.vue
@@ -1,112 +1,114 @@
 <template>
-  <UiCard
-    body-class="rounded overflow-auto px-0 h-full"
-    @close="onClose"
-  >
-    <div class="">
-      <nav
-        aria-label="Tabs Password Item"
-        aria-orientation="horizontal"
-        class="tabs tabs-bordered w-full transition-all duration-700 sticky top-0 z-10"
-        role="tablist"
-      >
-        <button
-          :id="id.details"
-          aria-controls="vaultDetailsId"
-          aria-selected="true"
-          class="tab active-tab:tab-active active w-full"
-          data-tab="#vaultDetailsId"
-          role="tab"
-          type="button"
+  <div class="p-1">
+    <UiCard
+      body-class="rounded overflow-auto px-0 h-full"
+      @close="onClose"
+    >
+      <div class="">
+        <nav
+          aria-label="Tabs Password Item"
+          aria-orientation="horizontal"
+          class="tabs tabs-bordered w-full transition-all duration-700 sticky top-0 z-10"
+          role="tablist"
         >
-          <Icon
-            name="material-symbols:key-outline"
-            class="me-2"
-          />
-          <span class="hidden sm:block">
-            {{ t('tab.details') }}
-          </span>
-        </button>
-        <button
-          :id="id.keyValue"
-          aria-controls="tabs-basic-2"
-          aria-selected="false"
-          class="tab active-tab:tab-active w-full"
-          data-tab="#tabs-basic-2"
-          role="tab"
-          type="button"
-        >
-          <Icon
-            name="fluent:group-list-20-filled"
-            class="me-2"
-          />
-          <span class="hidden sm:block">
-            {{ t('tab.keyValue') }}
-          </span>
-        </button>
-        <button
-          :id="id.history"
-          aria-controls="tabs-basic-3"
-          aria-selected="false"
-          class="tab active-tab:tab-active w-full"
-          data-tab="#tabs-basic-3"
-          role="tab"
-          type="button"
-        >
-          <Icon
-            name="material-symbols:history"
-            class="me-2"
-          />
-          <span class="hidden sm:block">
-            {{ t('tab.history') }}
-          </span>
-        </button>
-      </nav>
+          <button
+            :id="id.details"
+            aria-controls="vaultDetailsId"
+            aria-selected="true"
+            class="tab active-tab:tab-active active w-full"
+            data-tab="#vaultDetailsId"
+            role="tab"
+            type="button"
+          >
+            <Icon
+              name="material-symbols:key-outline"
+              class="me-2"
+            />
+            <span class="hidden sm:block">
+              {{ t('tab.details') }}
+            </span>
+          </button>
+          <button
+            :id="id.keyValue"
+            aria-controls="tabs-basic-2"
+            aria-selected="false"
+            class="tab active-tab:tab-active w-full"
+            data-tab="#tabs-basic-2"
+            role="tab"
+            type="button"
+          >
+            <Icon
+              name="fluent:group-list-20-filled"
+              class="me-2"
+            />
+            <span class="hidden sm:block">
+              {{ t('tab.keyValue') }}
+            </span>
+          </button>
+          <button
+            :id="id.history"
+            aria-controls="tabs-basic-3"
+            aria-selected="false"
+            class="tab active-tab:tab-active w-full"
+            data-tab="#tabs-basic-3"
+            role="tab"
+            type="button"
+          >
+            <Icon
+              name="material-symbols:history"
+              class="me-2"
+            />
+            <span class="hidden sm:block">
+              {{ t('tab.history') }}
+            </span>
+          </button>
+        </nav>
 
-      <div class="h-full pb-8">
-        <div
-          id="vaultDetailsId"
-          role="tabpanel"
-          class="h-full"
-          :aria-labelledby="id.details"
-        >
-          <HaexPassItemDetails
-            v-if="details"
-            v-model="details"
-            with-copy-button
-            :read_only
-            :defaultIcon
-            v-model:prevent-close="preventClose"
-          />
-        </div>
+        <div class="h-full pb-8">
+          <div
+            id="vaultDetailsId"
+            role="tabpanel"
+            class="h-full"
+            :aria-labelledby="id.details"
+          >
+            <HaexPassItemDetails
+              v-if="details"
+              v-model="details"
+              with-copy-button
+              :read_only
+              :defaultIcon
+              v-model:prevent-close="preventClose"
+            />
+          </div>
 
-        <div
-          id="tabs-basic-2"
-          class="hidden"
-          role="tabpanel"
-          :aria-labelledby="id.keyValue"
-        >
-          <HaexPassItemKeyValue
-            v-if="keyValues"
-            v-model="keyValues"
-            v-model:items-to-add="keyValuesAdd"
-            v-model:items-to-delete="keyValuesDelete"
-            :read_only
-            :item-id="details!.id"
-          />
-        </div>
+          <div
+            id="tabs-basic-2"
+            class="hidden"
+            role="tabpanel"
+            :aria-labelledby="id.keyValue"
+          >
+            <HaexPassItemKeyValue
+              v-if="keyValues"
+              v-model="keyValues"
+              v-model:items-to-add="keyValuesAdd"
+              v-model:items-to-delete="keyValuesDelete"
+              :read_only
+              :item-id="details!.id"
+            />
+          </div>
 
-        <div
-          id="tabs-basic-3"
-          class="hidden h-full"
-          role="tabpanel"
-          :aria-labelledby="id.history"
-        >
-          <!-- <HaexPassItemHistory v-model="itemHistory" /> -->
+          <div
+            id="tabs-basic-3"
+            class="hidden h-full"
+            role="tabpanel"
+            :aria-labelledby="id.history"
+          >
+            <!-- <HaexPassItemHistory v-model="itemHistory" /> -->
+          </div>
         </div>
       </div>
-    </div>
-  </UiCard>
+    </UiCard>
+  </div>
 </template>
 
 <script setup lang="ts">
diff --git a/src/components/haex/pass/mobile/menu/index.vue b/src/components/haex/pass/mobile/menu/index.vue
index 9e57f8c..f0e247f 100644
--- a/src/components/haex/pass/mobile/menu/index.vue
+++ b/src/components/haex/pass/mobile/menu/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div v-if="menuItems?.length">
     <ul
-      class="flex flex-col w-full h-full gap-y-2 *:first:rounded-t-md *:last:rounded-b-md"
+      class="flex flex-col w-full h-full gap-y-2 first:rounded-t-md last:rounded-b-md p-1"
       ref="listRef"
     >
       <li
diff --git a/src/pages/vault/[vaultId]/index.vue b/src/pages/vault/[vaultId]/index.vue
index b8e644b..375fa56 100644
--- a/src/pages/vault/[vaultId]/index.vue
+++ b/src/pages/vault/[vaultId]/index.vue
@@ -1,13 +1,10 @@
 <template>
-  <div>
-    aaaa
-    <div class="h-full text-base-content flex bg-base-200">
-      <HaexExtensionCard
-        v-for="extension in extensionStore.availableExtensions"
-        v-bind="extension"
-        :key="extension.id"
-      />
-    </div>
+  <div class="h-full text-base-content flex bg-base-200">
+    <HaexExtensionCard
+      v-for="extension in extensionStore.availableExtensions"
+      v-bind="extension"
+      :key="extension.id"
+    />
   </div>
 </template>
 
diff --git a/src/pages/vault/[vaultId]/passwords/[[groupId]]/edit.vue b/src/pages/vault/[vaultId]/passwords/[[groupId]]/edit.vue
index 2a27da2..4355abf 100644
--- a/src/pages/vault/[vaultId]/passwords/[[groupId]]/edit.vue
+++ b/src/pages/vault/[vaultId]/passwords/[[groupId]]/edit.vue
@@ -1,6 +1,5 @@
 <template>
   <div>
-    {{ group }}
     <HaexPassGroup
       v-model="group"
       mode="edit"
diff --git a/src/pages/vault/[vaultId]/passwords/[[groupId]]/index.vue b/src/pages/vault/[vaultId]/passwords/[[groupId]]/index.vue
index 39c63d9..6b820e6 100644
--- a/src/pages/vault/[vaultId]/passwords/[[groupId]]/index.vue
+++ b/src/pages/vault/[vaultId]/passwords/[[groupId]]/index.vue
@@ -1,33 +1,32 @@
 <template>
   <div class="relative h-full">
     <div class="h-full">
-      <div class="h-full overflow-auto p-1 flex flex-col">
+      <div class="h-full overflow-auto flex flex-col">
         <HaexPassGroupBreadcrumbs
           :items="breadCrumbs"
+          class="px-2"
           v-show="breadCrumbs.length"
         />
 
         <HaexPassMobileMenu
-          ref="listRef"
           :menu-items="groupItems"
+          ref="listRef"
           v-model:selected-items="selectedItems"
-          sel
         />
       </div>
 
       <div
-        class="fixed bottom-4 flex justify-between transition-all pointer-events-none right-0 sm:items-center items-end"
+        class="fixed bottom-4 flex justify-between transition-all pointer-events-none right-0 sm:items-center items-end px-8"
         :class="[isVisible ? 'left-15 ' : 'left-0']"
       >
-        <div class="w-full pl-8"></div>
-
+        <div class="w-full"></div>
         <UiButtonAction
-          :menu
           v-if="!inTrashGroup"
+          :menu
         />
 
         <div
-          class="flex flex-col sm:flex-row gap-4 w-full justify-end items-end pr-8"
+          class="flex flex-col sm:flex-row gap-4 w-full justify-end items-end"
         >
           <UiButton
             v-show="selectedItems.size === 1"