Skip to content
Snippets Groups Projects
Commit 782cc7f4 authored by Konrad Mohrfeldt's avatar Konrad Mohrfeldt :koala:
Browse files

feat: add Collapse component

parent dd4346d8
No related branches found
No related tags found
No related merge requests found
<template>
<div
:aria-hidden="isCollapsed ? 'true' : 'false'"
:style="{ height }"
class="tw-p-4 -tw-m-4 tw-overflow-y-hidden tw-relative"
:class="{ collapsed: isCollapsed }"
>
<slot />
</div>
</template>
<script lang="ts" setup>
import { computed } from 'vue'
defineOptions({
compatConfig: {
MODE: 3,
},
})
const props = defineProps<{
isCollapsed: boolean
peek?: string
}>()
defineEmits<{
'update:isCollapsed': [boolean]
}>()
const height = computed(() => {
return !props.isCollapsed ? 'auto' : props.peek ?? '0'
})
</script>
<style lang="postcss" scoped>
.collapsed::after {
content: '';
position: absolute;
inset-inline: 0;
bottom: 0;
top: 60%;
background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 100%);
}
</style>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment