mirrors/homebox
1
0
Fork 1
mirror of https://github.com/hay-kot/homebox.git synced 2025-08-06 09:30:29 +00:00
Code Issues Projects Releases Packages Wiki Activity

update event listener to only bind when collapsable

Browse source
This commit is contained in:
Hayden 2023-03-22 18:58:53 -08:00
parent bd6c24d35a
commit 6687b1df81
No known key found for this signature in database
GPG key ID: 17CF79474E257545
1 changed files with 6 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
frontend/components/Base/Card.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div class="card bg-base-100 shadow-xl sm:rounded-lg"> <div class="card bg-base-100 shadow-xl sm:rounded-lg">
<div v-if="$slots.title" class="px-4 py-5 sm:px-6"> <div v-if="$slots.title" class="px-4 py-5 sm:px-6">
<component :is="collapsable ? 'button' : 'div'" @click="collapsed = !collapsed"> <component :is="collapsable ? 'button' : 'div'" v-on="collapsable ? { click: toggle } : {}">
<h3 class="text-lg font-medium leading-6 flex items-center"> <h3 class="text-lg font-medium leading-6 flex items-center">
<slot name="title"></slot> <slot name="title"></slot>
<template v-if="collapsable"> <template v-if="collapsable">
@ -26,7 +26,7 @@
'max-h-screen': !collapsed, 'max-h-screen': !collapsed,
'max-h-0': collapsed, 'max-h-0': collapsed,
}" }"
class="transition-[max-height] duration-150 overflow-hidden" class="transition-[max-height] duration-200 overflow-hidden"
> >
<slot /> <slot />
</div> </div>
@ -38,5 +38,9 @@
collapsable?: boolean; collapsable?: boolean;
}>(); }>();
function toggle() {
collapsed.value = !collapsed.value;
}
const collapsed = ref(false); const collapsed = ref(false);
</script> </script>