imshvc/noxious_client
1
0
Fork 0
forked from noxious/client
Code Pull Requests Activity

Sprite manager front- and backend logics

Browse Source
This commit is contained in:
Dennis Postma
2024-07-24 22:32:14 +02:00
parent 026165cff3
commit ffe97312c9
18 changed files with 242 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/utilities/Accordion.vue
View File

@ -1,11 +1,11 @@
<template>
<div class="border border-gray-300 rounded mb-4">
<button @click="toggle" class="w-full p-3 bg-gray-100 rounded hover:bg-gray-200 text-left cursor-pointer transition-colors duration-200 ease-in-out">
{{ props.title }}
</button>
<div @click="toggle" class="w-[98%] p-3 bg-gray-100 bg-opacity-50 rounded hover:bg-gray-200 text-left text-white font-default cursor-pointer transition-colors duration-200 ease-in-out">
<slot name="header" />
</div>
<transition enter-active-class="transition-all duration-300 ease-in-out" leave-active-class="transition-all duration-300 ease-in-out" enter-from-class="opacity-0 max-h-0" enter-to-class="opacity-100 max-h-96" leave-from-class="opacity-100 max-h-96" leave-to-class="opacity-0 max-h-0">
<div v-if="isOpen" class="p-3 overflow-hidden">
<slot></slot>
<slot name="content" />
</div>
</transition>
</div>
@ -19,8 +19,4 @@ const isOpen = ref(false)
const toggle = () => {
isOpen.value = !isOpen.value
}
const props = defineProps({
title: String
})
</script>