From 1a3c403fcba300869190d269b9884dc07b1c8e00 Mon Sep 17 00:00:00 2001
From: Bernd Storath <999999bst@gmail.com>
Date: Tue, 7 Apr 2026 10:34:02 +0200
Subject: [PATCH] general cleanup

---
 src/app/components/ClientCard/ClientCard.vue |  2 +-
 src/app/components/ClientCard/ExpireDate.vue |  4 +--
 src/app/components/Clients/Search.vue        |  2 +-
 src/app/components/Form/Heading.vue          |  4 +--
 src/app/components/Form/Label.vue            |  6 ++--
 src/app/components/Form/SwitchField.vue      |  4 ++-
 src/app/components/Panel/head/Head.vue       |  2 +-
 src/app/components/Panel/head/Title.vue      |  8 +-----
 src/app/pages/admin.vue                      | 30 +++++++++++++-------
 src/app/pages/clients/[id].vue               |  4 ++-
 src/app/pages/index.vue                      |  4 ++-
 src/app/pages/me.vue                         |  4 ++-
 12 files changed, 42 insertions(+), 32 deletions(-)

diff --git a/src/app/components/ClientCard/ClientCard.vue b/src/app/components/ClientCard/ClientCard.vue
index e5732bf0..b60f44d6 100644
--- a/src/app/components/ClientCard/ClientCard.vue
+++ b/src/app/components/ClientCard/ClientCard.vue
@@ -9,7 +9,7 @@
         <div class="flex flex-grow flex-col gap-1">
           <ClientCardName :client="client" />
           <div
-            class="flex flex-col pb-1 text-xs text-gray-500 md:inline-block md:pb-0 dark:text-neutral-400"
+            class="flex flex-col text-xs text-gray-500 dark:text-neutral-400"
           >
             <div>
               <ClientCardAddress :client="client" />
diff --git a/src/app/components/ClientCard/ExpireDate.vue b/src/app/components/ClientCard/ExpireDate.vue
index 3d8e1e04..293b8692 100644
--- a/src/app/components/ClientCard/ExpireDate.vue
+++ b/src/app/components/ClientCard/ExpireDate.vue
@@ -1,7 +1,5 @@
 <template>
-  <div
-    class="block pb-1 text-xs text-gray-500 md:inline-block md:pb-0 dark:text-neutral-400"
-  >
+  <div class="block text-xs text-gray-500 dark:text-neutral-400">
     <span class="inline-block">{{ expiredDateFormat(client.expiresAt) }}</span>
   </div>
 </template>
diff --git a/src/app/components/Clients/Search.vue b/src/app/components/Clients/Search.vue
index 94ebbe46..1f862b67 100644
--- a/src/app/components/Clients/Search.vue
+++ b/src/app/components/Clients/Search.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="relative w-60 md:mr-2">
+  <div class="relative">
     <div class="relative flex h-full items-center">
       <IconsMagnifyingGlass
         class="absolute left-2.5 h-4 w-4 text-gray-400 dark:text-neutral-500"
diff --git a/src/app/components/Form/Heading.vue b/src/app/components/Form/Heading.vue
index 999639a7..3d403114 100644
--- a/src/app/components/Form/Heading.vue
+++ b/src/app/components/Form/Heading.vue
@@ -1,10 +1,10 @@
 <template>
-  <h4 class="col-span-full flex items-center py-6 text-2xl">
+  <h3 class="col-span-full flex items-center py-6 text-2xl">
     <slot />
     <BaseTooltip v-if="description" :text="description">
       <IconsInfo class="size-4" />
     </BaseTooltip>
-  </h4>
+  </h3>
 </template>
 
 <script lang="ts" setup>
diff --git a/src/app/components/Form/Label.vue b/src/app/components/Form/Label.vue
index 90f4804b..d26df8e4 100644
--- a/src/app/components/Form/Label.vue
+++ b/src/app/components/Form/Label.vue
@@ -1,7 +1,7 @@
 <template>
-  <RLabel :for="props.for" class="md:align-middle md:leading-10"
-    ><slot
-  /></RLabel>
+  <RLabel :for="props.for" class="md:leading-[2.75rem]">
+    <slot />
+  </RLabel>
 </template>
 
 <script lang="ts" setup>
diff --git a/src/app/components/Form/SwitchField.vue b/src/app/components/Form/SwitchField.vue
index 43eaf3f8..3175d8d5 100644
--- a/src/app/components/Form/SwitchField.vue
+++ b/src/app/components/Form/SwitchField.vue
@@ -7,7 +7,9 @@
       <IconsInfo class="size-4" />
     </BaseTooltip>
   </div>
-  <BaseSwitch :id="id" v-model="data" />
+  <div class="my-auto">
+    <BaseSwitch :id="id" v-model="data" />
+  </div>
 </template>
 
 <script lang="ts" setup>
diff --git a/src/app/components/Panel/head/Head.vue b/src/app/components/Panel/head/Head.vue
index e6c8d86f..4d4b80be 100644
--- a/src/app/components/Panel/head/Head.vue
+++ b/src/app/components/Panel/head/Head.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="flex flex-auto flex-grow flex-col items-center gap-2 border-b-2 border-gray-100 p-3 px-5 sm:flex-row dark:border-neutral-600"
+    class="flex flex-col items-center gap-2 border-b-2 border-gray-100 p-3 px-5 sm:flex-row dark:border-neutral-600"
   >
     <slot />
   </div>
diff --git a/src/app/components/Panel/head/Title.vue b/src/app/components/Panel/head/Title.vue
index d3c4ffb3..8b942722 100644
--- a/src/app/components/Panel/head/Title.vue
+++ b/src/app/components/Panel/head/Title.vue
@@ -1,11 +1,5 @@
 <template>
   <h2 class="flex-1 break-all text-2xl font-medium">
-    {{ text }}
+    <slot />
   </h2>
 </template>
-
-<script setup lang="ts">
-const { text } = defineProps<{
-  text: string;
-}>();
-</script>
diff --git a/src/app/pages/admin.vue b/src/app/pages/admin.vue
index 48f30f21..1576d8bd 100644
--- a/src/app/pages/admin.vue
+++ b/src/app/pages/admin.vue
@@ -2,13 +2,17 @@
   <div>
     <div class="container mx-auto p-4">
       <div class="flex flex-col gap-4 lg:flex-row">
-        <div class="rounded-lg bg-white p-4 lg:w-64 dark:bg-neutral-700">
-          <NuxtLink to="/admin">
-            <h2 class="mb-4 text-xl font-bold dark:text-neutral-200">
-              {{ t('pages.admin.panel') }}
-            </h2>
-          </NuxtLink>
-          <div class="flex flex-col space-y-2">
+        <div
+          class="overflow-hidden rounded-lg bg-white text-gray-700 shadow-md lg:w-64 dark:bg-neutral-700 dark:text-neutral-200"
+        >
+          <PanelHead>
+            <PanelHeadTitle>
+              <NuxtLink to="/admin">
+                {{ t('pages.admin.panel') }}
+              </NuxtLink>
+            </PanelHeadTitle>
+          </PanelHead>
+          <div class="flex flex-col space-y-2 p-4">
             <NuxtLink
               v-for="(item, index) in menuItems"
               :key="index"
@@ -27,10 +31,16 @@
         </div>
 
         <div
-          class="flex-1 rounded-lg bg-white p-6 dark:bg-neutral-700 dark:text-neutral-200"
+          class="flex-1 overflow-hidden rounded-lg bg-white text-gray-700 shadow-md dark:bg-neutral-700 dark:text-neutral-200"
         >
-          <h1 class="mb-6 text-3xl font-bold">{{ activeMenuItem.name }}</h1>
-          <NuxtPage />
+          <PanelHead>
+            <PanelHeadTitle>
+              {{ activeMenuItem.name }}
+            </PanelHeadTitle>
+          </PanelHead>
+          <section class="p-6">
+            <NuxtPage />
+          </section>
         </div>
       </div>
     </div>
diff --git a/src/app/pages/clients/[id].vue b/src/app/pages/clients/[id].vue
index 5c419326..f4714ea9 100644
--- a/src/app/pages/clients/[id].vue
+++ b/src/app/pages/clients/[id].vue
@@ -2,7 +2,9 @@
   <main v-if="data">
     <Panel>
       <PanelHead>
-        <PanelHeadTitle :text="data.name" />
+        <PanelHeadTitle>
+          {{ data.name }}
+        </PanelHeadTitle>
       </PanelHead>
       <PanelBody>
         <FormElement @submit.prevent="submit">
diff --git a/src/app/pages/index.vue b/src/app/pages/index.vue
index bca9040d..4b36b399 100644
--- a/src/app/pages/index.vue
+++ b/src/app/pages/index.vue
@@ -2,7 +2,9 @@
   <main>
     <Panel>
       <PanelHead>
-        <PanelHeadTitle :text="$t('pages.clients')" />
+        <PanelHeadTitle>
+          {{ $t('pages.clients') }}
+        </PanelHeadTitle>
         <PanelHeadBoat>
           <ClientsSearch />
           <div class="flex gap-2">
diff --git a/src/app/pages/me.vue b/src/app/pages/me.vue
index 0ef5210d..65c68ae9 100644
--- a/src/app/pages/me.vue
+++ b/src/app/pages/me.vue
@@ -2,7 +2,9 @@
   <main>
     <Panel>
       <PanelHead>
-        <PanelHeadTitle :text="$t('pages.me')" />
+        <PanelHeadTitle>
+          {{ $t('pages.me') }}
+        </PanelHeadTitle>
       </PanelHead>
       <PanelBody class="dark:text-neutral-200">
         <FormElement @submit.prevent="submit">