filter on top

src/components/StatusFilter.vue

@@ -11,6 +11,7 @@ const emit = defineEmits<{ changed: [value: string] }>()
 const statusStore = useStatusStore()
 const selected = ref(status)
 const onUpdate = (val: unknown) => emit('changed', val as string)
+
 watch(
   () => status,
   (val) => {
@@ -24,11 +25,20 @@ watch(
     v-model="selected"
     divided
     size="default"
-    density="compact"
-    variant="text"
+    density="comfortable"
+    variant="flat"
     @update:model-value="onUpdate"
   >
-    <v-btn slim v-for="el in statusStore.statuses" :color="el.color" :value="el.alias" :key="el.alias" rounded="0">
+    <v-btn
+      border
+      slim
+      v-for="el in statusStore.statuses"
+      :color="el.color"
+      :value="el.alias"
+      :key="el.alias"
+      rounded="0"
+    >
+      <!--      <v-icon :icon="icons.get(el.alias)" class="mr-1" />-->
       <div class="text-default">{{ el.name }}</div>
     </v-btn>
   </v-btn-toggle>