zwischenstand

src/pages/index.vue

@@ -1,89 +1,33 @@
 <template>
   <div class="items-center justify-center min-h-full flex w-full relative">
     <div class="fixed top-2 right-2">
-      <UiDropdownLocale @select="setLocale" />
+      <!-- <UiDropdownLocale @select="setLocale" /> -->
+      <ThemeSwitcher />
+
     </div>
     <div class="flex flex-col justify-center items-center gap-5 max-w-3xl">
-      <img
-        src="/logo.svg"
-        class="bg-primary p-3 size-16 rounded-full"
-        alt="HaexVault Logo"
-      />
+      <img src="/logo.svg" class="bg-primary p-3 size-16 rounded-full" alt="HaexVault Logo" />
 
-      <span
-        class="flex flex-wrap font-bold text-pretty text-xl gap-2 justify-center"
-      >
+      <span class="flex flex-wrap font-bold text-pretty text-xl gap-2 justify-center">
         <p class="whitespace-nowrap">
           {{ t('welcome') }}
         </p>
-        <UiTextGradient>Haex Hub</UiTextGradient>
+        <!-- <UiTextGradient>Haex Hub</UiTextGradient> -->
       </span>
 
       <div class="flex flex-col md:flex-row gap-4 w-full h-24 md:h-auto">
         <VaultButtonCreate />
+        <TestDialog />
+        <BaseDialog />
+        <!-- 
 
         <VaultButtonOpen
           v-model:isOpen="passwordPromptOpen"
           :path="vaultPath"
-        />
-        <UiDialogTest />
+        /> -->
+
 
-        <UiDialog> aaaaaa </UiDialog>
-        <button
-          type="button"
-          class="btn btn-primary"
-          aria-haspopup="dialog"
-          aria-expanded="false"
-          aria-controls="basic-modal"
-          data-overlay="#basic-modal1"
-        >
-          Open modal
-        </button>
 
-        <div
-          id="basic-modal1"
-          class="overlay modal overlay-open:opacity-100 hidden overlay-open:duration-300"
-          role="dialog"
-          tabindex="-1"
-        >
-          <div
-            class="modal-dialog overlay-open:opacity-100 overlay-open:duration-300"
-          >
-            <div class="modal-content">
-              <div class="modal-header">
-                <h3 class="modal-title">Dialog Title</h3>
-                <button
-                  type="button"
-                  class="btn btn-text btn-circle btn-sm absolute end-3 top-3"
-                  aria-label="Close"
-                  data-overlay="#basic-modal1"
-                >
-                  <span class="icon-[tabler--x] size-4"></span>
-                </button>
-              </div>
-              <div class="modal-body">
-                This is some placeholder content to show the scrolling behavior
-                for modals. Instead of repeating the text in the modal, we use
-                an inline style to set a minimum height, thereby extending the
-                length of the overall modal and demonstrating the overflow
-                scrolling. When content becomes longer than the height of the
-                viewport, scrolling will move the modal as needed.
-              </div>
-              <div class="modal-footer">
-                <button
-                  type="button"
-                  class="btn btn-soft btn-secondary"
-                  data-overlay="#basic-modal1"
-                >
-                  Close
-                </button>
-                <button type="button" class="btn btn-primary">
-                  Save changes
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
       </div>
 
       <div v-show="lastVaults.length" class="w-full">
@@ -92,17 +36,12 @@
         </div>
 
         <div
-          class="relative border-base-content/25 divide-base-content/25 flex w-full flex-col divide-y rounded-md border first:*:rounded-t-md last:*:rounded-b-md overflow-scroll"
-        >
-          <div
-            class="flex items-center justify-between group h-12 overflow-x-scroll"
-            v-for="vault in lastVaults"
-            :key="vault.path"
-          >
+          class="relative border-base-content/25 divide-base-content/25 flex w-full flex-col divide-y rounded-md border first:*:rounded-t-md last:*:rounded-b-md overflow-scroll">
+          <div class="flex items-center justify-between group h-12 overflow-x-scroll" v-for="vault in lastVaults"
+            :key="vault.path">
             <button
               class="link link-accent flex items-center no-underline justify-between text-nowrap text-sm md:text-base shrink w-full py-2 px-4"
-              @click=";(passwordPromptOpen = true), (vaultPath = vault.path)"
-            >
+              @click="; (passwordPromptOpen = true), (vaultPath = vault.path)">
               <span class="block md:hidden">
                 {{ vault.name }}
               </span>
@@ -110,13 +49,8 @@
                 {{ vault.path }}
               </span>
             </button>
-            <button
-              class="absolute right-2 btn btn-square btn-error btn-xs hidden group-hover:flex min-w-6"
-            >
-              <Icon
-                name="mdi:trash-can-outline"
-                @click="removeVaultAsync(vault.path)"
-              />
+            <button class="absolute right-2 btn btn-square btn-error btn-xs hidden group-hover:flex min-w-6">
+              <Icon name="mdi:trash-can-outline" @click="removeVaultAsync(vault.path)" />
             </button>
           </div>
         </div>
@@ -126,7 +60,7 @@
         <h4>{{ t('sponsors') }}</h4>
         <div>
           <button @click="openUrl('https://itemis.com')">
-            <UiLogoItemis class="text-[#00457C]" />
+            <!-- <UiLogoItemis class="text-[#00457C]" /> -->
           </button>
         </div>
       </div>
@@ -152,8 +86,7 @@ const { lastVaults } = storeToRefs(useLastVaultStore())
 await syncLastVaultsAsync()
 </script>
 
-<i18n lang="json">
-{
+<i18n lang="json">{
   "de": {
     "welcome": "Viel Spass mit",
     "lastUsed": "Zuletzt verwendete Vaults",
@@ -164,5 +97,4 @@ await syncLastVaultsAsync()
     "lastUsed": "Last used Vaults",
     "sponsors": "Powered by"
   }
-}
-</i18n>
+}</i18n>