code cleanup for search bar

This commit is contained in:
Mika Bomm 2024-09-05 11:46:57 +02:00
parent 6523d15637
commit 26bc3ae957

View file

@ -2,10 +2,6 @@
import { ref } from "vue";
const showSearch = ref(false);
const toggleSearch = () => {
showSearch.value = !showSearch.value;
};
</script>
<template>
@ -22,13 +18,16 @@ const toggleSearch = () => {
<template v-slot:append class="align-center justify-center">
<v-btn icon="mdi-heart"></v-btn>
<v-btn icon="mdi-magnify" @click="toggleSearch"> </v-btn>
<!---------------->
<!-- Search Bar -->
<!---------------->
<v-btn icon="mdi-magnify" @click="showSearch = !showSearch"> </v-btn>
<v-slide-x-reverse-transition hide-on-leave>
<v-responsive v-show="showSearch" min-width="20vw">
<v-text-field
variant="solo-filled"
class="search-bar w-100 justify-center align-center"
class="w-100 justify-center align-center"
label="Search"
clearable
></v-text-field>