update to tailwind

2025-04-13 16:31:23 +02:00 · 2025-04-13 16:31:23 +02:00 · 835e6ef8db
commit 835e6ef8db
parent c4a67fd11a
33 changed files with 121 additions and 57 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -40,6 +40,7 @@
        "unplugin-vue-markdown": "^28.3.1",
        "uuid": "^11.1.0",
        "vue": "^3.4.29",
+        "vue-qrcode-reader": "^5.7.1",
        "vue-router": "^4.3.3"
      },
      "devDependencies": {
@ -3691,6 +3692,18 @@
        "@types/underscore": "*"
      }
    },
+    "node_modules/@types/dom-webcodecs": {
+      "version": "0.1.14",
+      "resolved": "https://registry.npmjs.org/@types/dom-webcodecs/-/dom-webcodecs-0.1.14.tgz",
+      "integrity": "sha512-ba9aF0qARLLQpLihONIRbj8VvAdUxO+5jIxlscVcDAQTcJmq5qVr781+ino5qbQUJUmO21cLP2eLeXYWzao5Vg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/emscripten": {
+      "version": "1.40.1",
+      "resolved": "https://registry.npmjs.org/@types/emscripten/-/emscripten-1.40.1.tgz",
+      "integrity": "sha512-sr53lnYkQNhjHNN0oJDdUm5564biioI5DuOpycufDVK7D3y+GR3oUswe2rlwY1nPNyusHbrJ9WoTyIHl4/Bpwg==",
+      "license": "MIT"
+    },
    "node_modules/@types/eslint": {
      "version": "9.6.1",
      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.1.tgz",
@ -4706,6 +4719,16 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/barcode-detector": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/barcode-detector/-/barcode-detector-2.2.2.tgz",
+      "integrity": "sha512-JcSekql+EV93evfzF9zBr+Y6aRfkR+QFvgyzbwQ0dbymZXoAI9+WgT7H1E429f+3RKNncHz2CW98VQtaaKpmfQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/dom-webcodecs": "^0.1.11",
+        "zxing-wasm": "1.1.3"
+      }
+    },
    "node_modules/birpc": {
      "version": "0.2.19",
      "resolved": "https://registry.npmjs.org/birpc/-/birpc-0.2.19.tgz",
@ -9241,6 +9264,12 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/sdp": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/sdp/-/sdp-3.2.0.tgz",
+      "integrity": "sha512-d7wDPgDV3DDiqulJjKiV2865wKsJ34YI+NDREbm+FySq6WuKOikwyNQcm+doLAZ1O6ltdO0SeKle2xMpN3Brgw==",
+      "license": "MIT"
+    },
    "node_modules/section-matter": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/section-matter/-/section-matter-1.0.0.tgz",
@ -10758,6 +10787,19 @@
        "url": "https://opencollective.com/eslint"
      }
    },
+    "node_modules/vue-qrcode-reader": {
+      "version": "5.7.1",
+      "resolved": "https://registry.npmjs.org/vue-qrcode-reader/-/vue-qrcode-reader-5.7.1.tgz",
+      "integrity": "sha512-7QBu3PqaPJHxobiDLqgcrp6wsjdTk9GJWhRCd4CgQYi93gBw/sIXNNWtbjeKz8d3QYj13n9dyPvcPMUcGOsBHw==",
+      "license": "MIT",
+      "dependencies": {
+        "barcode-detector": "2.2.2",
+        "webrtc-adapter": "8.2.3"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
    "node_modules/vue-router": {
      "version": "4.5.0",
      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.5.0.tgz",
@ -10803,6 +10845,19 @@
      "integrity": "sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==",
      "license": "MIT"
    },
+    "node_modules/webrtc-adapter": {
+      "version": "8.2.3",
+      "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-8.2.3.tgz",
+      "integrity": "sha512-gnmRz++suzmvxtp3ehQts6s2JtAGPuDPjA1F3a9ckNpG1kYdYuHWYpazoAnL9FS5/B21tKlhkorbdCXat0+4xQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "sdp": "^3.2.0"
+      },
+      "engines": {
+        "node": ">=6.0.0",
+        "npm": ">=3.10.0"
+      }
+    },
    "node_modules/whatwg-url": {
      "version": "7.1.0",
      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
@ -11509,6 +11564,15 @@
      "funding": {
        "url": "https://github.com/sponsors/sindresorhus"
      }
+    },
+    "node_modules/zxing-wasm": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/zxing-wasm/-/zxing-wasm-1.1.3.tgz",
+      "integrity": "sha512-MYm9k/5YVs4ZOTIFwlRjfFKD0crhefgbnt1+6TEpmKUDFp3E2uwqGSKwQOd2hOIsta/7Usq4hnpNRYTLoljnfA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/emscripten": "^1.39.10"
+      }
    }
  }
 }
--- a/src/components/ScanInput.vue
+++ b/src/components/ScanInput.vue
@ -2,7 +2,7 @@
  <div>
    <label :for="name">{{ label }}{{ required ? "" : " (optional)" }}</label>
    <div class="relative flex flex-row items-center gap-2">
-      <input ref="resultInput" class="!pl-9" :id="name" type="text" v-model="value" :required="required" />
+      <input ref="resultInput" class="pl-9!" :id="name" type="text" v-model="value" :required="required" />
      <QrCodeIcon class="absolute h-6 stroke-1 left-2 top-1/2 -translate-y-1/2 cursor-pointer z-10" @click="scanCode" />
    </div>
  </div>
--- a/src/components/admin/unit/respiratoryGear/CreateRespiratoryGearModal.vue
+++ b/src/components/admin/unit/respiratoryGear/CreateRespiratoryGearModal.vue
@ -10,7 +10,7 @@
          <ListboxLabel>Anrede</ListboxLabel>
          <div class="relative mt-1">
            <ListboxButton
-              class="rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none"
+              class="rounded-md shadow-xs relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-hidden focus:ring-0 focus:z-10 sm:text-sm resize-none"
            >
              <span class="block truncate w-full text-start"> {{ selectedSalutation?.salutation }}</span>
              <span class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
@ -24,7 +24,7 @@
              leave-to-class="opacity-0"
            >
              <ListboxOptions
-                class="absolute mt-1 max-h-60 z-20 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-none sm:text-sm h-32 overflow-y-auto"
+                class="absolute mt-1 max-h-60 z-20 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-sm h-32 overflow-y-auto"
              >
                <ListboxOption
                  v-slot="{ active, selected }"
--- a/src/components/admin/unit/respiratoryMission/CreateRespiratoryMissionModal.vue
+++ b/src/components/admin/unit/respiratoryMission/CreateRespiratoryMissionModal.vue
@ -10,7 +10,7 @@
          <ListboxLabel>Anrede</ListboxLabel>
          <div class="relative mt-1">
            <ListboxButton
-              class="rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none"
+              class="rounded-md shadow-xs relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-hidden focus:ring-0 focus:z-10 sm:text-sm resize-none"
            >
              <span class="block truncate w-full text-start"> {{ selectedSalutation?.salutation }}</span>
              <span class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
@ -24,7 +24,7 @@
              leave-to-class="opacity-0"
            >
              <ListboxOptions
-                class="absolute mt-1 max-h-60 z-20 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-none sm:text-sm h-32 overflow-y-auto"
+                class="absolute mt-1 max-h-60 z-20 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-sm h-32 overflow-y-auto"
              >
                <ListboxOption
                  v-slot="{ active, selected }"
--- a/src/components/admin/unit/respiratoryWearer/CreateRespiratoryWearerModal.vue
+++ b/src/components/admin/unit/respiratoryWearer/CreateRespiratoryWearerModal.vue
@ -10,7 +10,7 @@
          <ListboxLabel>Anrede</ListboxLabel>
          <div class="relative mt-1">
            <ListboxButton
-              class="rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none"
+              class="rounded-md shadow-xs relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-hidden focus:ring-0 focus:z-10 sm:text-sm resize-none"
            >
              <span class="block truncate w-full text-start"> {{ selectedSalutation?.salutation }}</span>
              <span class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
@ -24,7 +24,7 @@
              leave-to-class="opacity-0"
            >
              <ListboxOptions
-                class="absolute mt-1 max-h-60 z-20 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-none sm:text-sm h-32 overflow-y-auto"
+                class="absolute mt-1 max-h-60 z-20 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-hidden sm:text-sm h-32 overflow-y-auto"
              >
                <ListboxOption
                  v-slot="{ active, selected }"
--- a/src/views/admin/unit/damageReport/DamageReportRouting.vue
+++ b/src/views/admin/unit/damageReport/DamageReportRouting.vue
@ -18,8 +18,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isExactActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isExactActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/equipment/CreateEquipment.vue
+++ b/src/views/admin/unit/equipment/CreateEquipment.vue
@ -13,7 +13,7 @@
              <ComboboxLabel>Typ</ComboboxLabel>
              <div class="relative mt-1">
                <ComboboxInput
-                  class="rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none"
+                  class="rounded-md shadow-xs relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-hidden focus:ring-0 focus:z-10 sm:text-sm resize-none"
                  @input="query = $event.target.value"
                />
                <ComboboxButton class="absolute inset-y-0 right-0 flex items-center pr-2">
@ -26,7 +26,7 @@
                  @after-leave="query = ''"
                >
                  <ComboboxOptions
-                    class="z-20 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-none sm:text-sm"
+                    class="z-20 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-hidden sm:text-sm"
                  >
                    <ComboboxOption v-if="loading || deferingSearch" as="template" disabled>
                      <li class="flex flex-row gap-2 text-text relative cursor-default select-none py-2 pl-3 pr-4">
@ -91,12 +91,12 @@
              :to="{ name: 'admin-unit-equipment' }"
              primary-outline
              button
-              class="!w-fit"
+              class="w-fit!"
              :disabled="status == 'loading' || status?.status == 'success'"
            >
              abbrechen
            </RouterLink>
-            <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+            <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
            <Spinner v-if="status == 'loading'" class="my-auto" />
            <SuccessCheckmark v-else-if="status?.status == 'success'" />
            <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/equipment/Equipment.vue
+++ b/src/views/admin/unit/equipment/Equipment.vue
@ -27,7 +27,7 @@
            :to="{ name: 'admin-unit-equipment-create' }"
            primary
            button
-            class="!w-fit"
+            class="w-fit!"
          >
            Gerätschaft erfassen
          </RouterLink>
--- a/src/views/admin/unit/equipment/EquipmentRouting.vue
+++ b/src/views/admin/unit/equipment/EquipmentRouting.vue
@ -27,8 +27,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/equipment/UpdateEquipment.vue
+++ b/src/views/admin/unit/equipment/UpdateEquipment.vue
@ -18,10 +18,10 @@
        <input type="text" id="location" v-model="equipment.location" />
      </div>
      <div class="flex flex-row justify-end gap-2">
-        <button primary-outline type="reset" class="!w-fit" :disabled="canSaveOrReset" @click="resetForm">
+        <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
          abbrechen
        </button>
-        <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+        <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
        <Spinner v-if="status == 'loading'" class="my-auto" />
        <SuccessCheckmark v-else-if="status?.status == 'success'" />
        <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/equipmentType/EquipmentType.vue
+++ b/src/views/admin/unit/equipmentType/EquipmentType.vue
@ -21,7 +21,7 @@
        </Pagination>

        <div class="flex flex-row gap-4">
-          <button v-if="can('create', 'unit', 'equipment_type')" primary class="!w-fit" @click="openCreateModal">
+          <button v-if="can('create', 'unit', 'equipment_type')" primary class="w-fit!" @click="openCreateModal">
            Geräte-Typ erstellen
          </button>
        </div>
--- a/src/views/admin/unit/equipmentType/EquipmentTypeRouting.vue
+++ b/src/views/admin/unit/equipmentType/EquipmentTypeRouting.vue
@ -32,8 +32,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/equipmentType/InspectionPlans.vue
+++ b/src/views/admin/unit/equipmentType/InspectionPlans.vue
@ -13,7 +13,7 @@
    </Pagination>

    <div class="flex flex-row gap-4">
-      <button v-if="can('create', 'unit', 'equipment_type')" primary class="!w-fit" @click="">
+      <button v-if="can('create', 'unit', 'equipment_type')" primary class="w-fit!" @click="">
        Prüfplan erstellen
      </button>
    </div>
--- a/src/views/admin/unit/inspectionPlan/CreateInspectionPlan.vue
+++ b/src/views/admin/unit/inspectionPlan/CreateInspectionPlan.vue
@ -13,7 +13,7 @@
              <ComboboxLabel>Typ</ComboboxLabel>
              <div class="relative mt-1">
                <ComboboxInput
-                  class="rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none"
+                  class="rounded-md shadow-xs relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-hidden focus:ring-0 focus:z-10 sm:text-sm resize-none"
                  @input="query = $event.target.value"
                />
                <ComboboxButton class="absolute inset-y-0 right-0 flex items-center pr-2">
@ -26,7 +26,7 @@
                  @after-leave="query = ''"
                >
                  <ComboboxOptions
-                    class="z-20 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-none sm:text-sm"
+                    class="z-20 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-hidden sm:text-sm"
                  >
                    <ComboboxOption v-if="loading || deferingSearch" as="template" disabled>
                      <li class="flex flex-row gap-2 text-text relative cursor-default select-none py-2 pl-3 pr-4">
@ -90,12 +90,12 @@
              :to="{ name: 'admin-unit-inspectionPlan' }"
              primary-outline
              button
-              class="!w-fit"
+              class="w-fit!"
              :disabled="status == 'loading' || status?.status == 'success'"
            >
              abbrechen
            </RouterLink>
-            <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+            <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
            <Spinner v-if="status == 'loading'" class="my-auto" />
            <SuccessCheckmark v-else-if="status?.status == 'success'" />
            <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/inspectionPlan/InspectionPlan.vue
+++ b/src/views/admin/unit/inspectionPlan/InspectionPlan.vue
@ -27,7 +27,7 @@
            :to="{ name: 'admin-unit-inspection_plan-create' }"
            primary
            button
-            class="!w-fit"
+            class="w-fit!"
          >
            Prüfplan erstellen
          </RouterLink>
--- a/src/views/admin/unit/inspectionPlan/UpdateInspectionPlan.vue
+++ b/src/views/admin/unit/inspectionPlan/UpdateInspectionPlan.vue
@ -17,10 +17,10 @@
        <input type="text" id="interval" placeholder="<number>-(d|m|y) oder DD/MM" />
      </div>
      <div class="flex flex-row justify-end gap-2">
-        <button primary-outline type="reset" class="!w-fit" :disabled="canSaveOrReset" @click="resetForm">
+        <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
          abbrechen
        </button>
-        <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+        <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
        <Spinner v-if="status == 'loading'" class="my-auto" />
        <SuccessCheckmark v-else-if="status?.status == 'success'" />
        <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/respiratoryGear/RespiratoryGear.vue
+++ b/src/views/admin/unit/respiratoryGear/RespiratoryGear.vue
@ -21,7 +21,7 @@
        </Pagination>

        <div class="flex flex-row gap-4">
-          <button v-if="can('create', 'unit', 'respiratory_gear')" primary class="!w-fit" @click="openCreateModal">
+          <button v-if="can('create', 'unit', 'respiratory_gear')" primary class="w-fit!" @click="openCreateModal">
            Gerät erfassen
          </button>
        </div>
--- a/src/views/admin/unit/respiratoryGear/RespiratoryGearRouting.vue
+++ b/src/views/admin/unit/respiratoryGear/RespiratoryGearRouting.vue
@ -31,8 +31,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/respiratoryMission/RespiratoryMission.vue
+++ b/src/views/admin/unit/respiratoryMission/RespiratoryMission.vue
@ -21,7 +21,7 @@
        </Pagination>

        <div class="flex flex-row gap-4">
-          <button v-if="can('create', 'unit', 'respiratory_mission')" primary class="!w-fit" @click="openCreateModal">
+          <button v-if="can('create', 'unit', 'respiratory_mission')" primary class="w-fit!" @click="openCreateModal">
            Einsatz erfassen
          </button>
        </div>
--- a/src/views/admin/unit/respiratoryMission/RespiratoryMissionRouting.vue
+++ b/src/views/admin/unit/respiratoryMission/RespiratoryMissionRouting.vue
@ -21,8 +21,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/respiratoryWearer/RespiratoryWearer.vue
+++ b/src/views/admin/unit/respiratoryWearer/RespiratoryWearer.vue
@ -21,7 +21,7 @@
        </Pagination>

        <div class="flex flex-row gap-4">
-          <button v-if="can('create', 'unit', 'respiratory_wearer')" primary class="!w-fit" @click="openCreateModal">
+          <button v-if="can('create', 'unit', 'respiratory_wearer')" primary class="w-fit!" @click="openCreateModal">
            Träger erfassen
          </button>
        </div>
--- a/src/views/admin/unit/respiratoryWearer/RespiratoryWearerRouting.vue
+++ b/src/views/admin/unit/respiratoryWearer/RespiratoryWearerRouting.vue
@ -24,8 +24,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/vehicle/Vehicle.vue
+++ b/src/views/admin/unit/vehicle/Vehicle.vue
@ -25,7 +25,7 @@
            v-if="can('create', 'unit', 'equipment')"
            :to="{ name: 'admin-unit-vehicle-create' }"
            primary
-            class="!w-fit"
+            class="w-fit!"
          >
            Fahrzeug erstellen
          </RouterLink>
--- a/src/views/admin/unit/vehicle/VehicleRouting.vue
+++ b/src/views/admin/unit/vehicle/VehicleRouting.vue
@ -27,8 +27,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/vehicleType/InspectionPlans.vue
+++ b/src/views/admin/unit/vehicleType/InspectionPlans.vue
@ -13,7 +13,7 @@
    </Pagination>

    <div class="flex flex-row gap-4">
-      <button v-if="can('create', 'unit', 'equipment_type')" primary class="!w-fit" @click="">
+      <button v-if="can('create', 'unit', 'equipment_type')" primary class="w-fit!" @click="">
        Prüfplan erstellen
      </button>
    </div>
--- a/src/views/admin/unit/vehicleType/VehicleType.vue
+++ b/src/views/admin/unit/vehicleType/VehicleType.vue
@ -21,7 +21,7 @@
        </Pagination>

        <div class="flex flex-row gap-4">
-          <button v-if="can('create', 'unit', 'vehicle_type')" primary class="!w-fit" @click="openCreateModal">
+          <button v-if="can('create', 'unit', 'vehicle_type')" primary class="w-fit!" @click="openCreateModal">
            Geräte-Typ erstellen
          </button>
        </div>
--- a/src/views/admin/unit/vehicleType/VehicleTypeRouting.vue
+++ b/src/views/admin/unit/vehicleType/VehicleTypeRouting.vue
@ -32,8 +32,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/wearable/CreateWearable.vue
+++ b/src/views/admin/unit/wearable/CreateWearable.vue
@ -13,7 +13,7 @@
              <ComboboxLabel>Typ</ComboboxLabel>
              <div class="relative mt-1">
                <ComboboxInput
-                  class="rounded-md shadow-sm relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-none focus:ring-0 focus:z-10 sm:text-sm resize-none"
+                  class="rounded-md shadow-xs relative block w-full px-3 py-2 border border-gray-300 focus:border-primary placeholder-gray-500 text-gray-900 rounded-b-md focus:outline-hidden focus:ring-0 focus:z-10 sm:text-sm resize-none"
                  @input="query = $event.target.value"
                />
                <ComboboxButton class="absolute inset-y-0 right-0 flex items-center pr-2">
@ -26,7 +26,7 @@
                  @after-leave="query = ''"
                >
                  <ComboboxOptions
-                    class="z-20 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-none sm:text-sm"
+                    class="z-20 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-md ring-1 ring-black/5 focus:outline-hidden sm:text-sm"
                  >
                    <ComboboxOption v-if="loading || deferingSearch" as="template" disabled>
                      <li class="flex flex-row gap-2 text-text relative cursor-default select-none py-2 pl-3 pr-4">
@ -92,12 +92,12 @@
              :to="{ name: 'admin-unit-wearable' }"
              primary-outline
              button
-              class="!w-fit"
+              class="w-fit!"
              :disabled="status == 'loading' || status?.status == 'success'"
            >
              abbrechen
            </RouterLink>
-            <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+            <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
            <Spinner v-if="status == 'loading'" class="my-auto" />
            <SuccessCheckmark v-else-if="status?.status == 'success'" />
            <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/wearable/UpdateWearable.vue
+++ b/src/views/admin/unit/wearable/UpdateWearable.vue
@ -19,10 +19,10 @@
      </div>
      <MemberSearchSelect title="Träger (optional)" />
      <div class="flex flex-row justify-end gap-2">
-        <button primary-outline type="reset" class="!w-fit" :disabled="canSaveOrReset" @click="resetForm">
+        <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
          abbrechen
        </button>
-        <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+        <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
        <Spinner v-if="status == 'loading'" class="my-auto" />
        <SuccessCheckmark v-else-if="status?.status == 'success'" />
        <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/wearable/Wearable.vue
+++ b/src/views/admin/unit/wearable/Wearable.vue
@ -27,7 +27,7 @@
            :to="{ name: 'admin-unit-wearable-create' }"
            primary
            button
-            class="!w-fit"
+            class="w-fit!"
          >
            Kleidung erfassen
          </RouterLink>
--- a/src/views/admin/unit/wearable/WearableRouting.vue
+++ b/src/views/admin/unit/wearable/WearableRouting.vue
@ -27,8 +27,8 @@
            >
              <p
                :class="[
-                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-none',
-                  isActive ? 'bg-red-200 shadow border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
+                  'w-full rounded-lg py-2.5 text-sm text-center font-medium leading-5 focus:ring-0 outline-hidden',
+                  isActive ? 'bg-red-200 shadow-sm border-b-2 border-primary rounded-b-none' : ' hover:bg-red-200',
                ]"
              >
                {{ tab.title }}
--- a/src/views/admin/unit/wearableType/UpdateWearableType.vue
+++ b/src/views/admin/unit/wearableType/UpdateWearableType.vue
@ -17,10 +17,10 @@
        <input type="text" id="description" v-model="wearableType.description" />
      </div>
      <div class="flex flex-row justify-end gap-2">
-        <button primary-outline type="reset" class="!w-fit" :disabled="canSaveOrReset" @click="resetForm">
+        <button primary-outline type="reset" class="w-fit!" :disabled="canSaveOrReset" @click="resetForm">
          abbrechen
        </button>
-        <button primary type="submit" class="!w-fit" :disabled="status == 'loading'">speichern</button>
+        <button primary type="submit" class="w-fit!" :disabled="status == 'loading'">speichern</button>
        <Spinner v-if="status == 'loading'" class="my-auto" />
        <SuccessCheckmark v-else-if="status?.status == 'success'" />
        <FailureXMark v-else-if="status?.status == 'failed'" />
--- a/src/views/admin/unit/wearableType/WearableType.vue
+++ b/src/views/admin/unit/wearableType/WearableType.vue
@ -21,7 +21,7 @@
        </Pagination>

        <div class="flex flex-row gap-4">
-          <button v-if="can('create', 'unit', 'wearable_type')" primary class="!w-fit" @click="openCreateModal">
+          <button v-if="can('create', 'unit', 'wearable_type')" primary class="w-fit!" @click="openCreateModal">
            Geräte-Typ erstellen
          </button>
        </div>