Files
webapp/app/components/ui/GridItem.vue
2026-01-07 09:10:35 +07:00

33 lines
673 B
Vue

<template>
<div :class="itemClass">
<slot />
</div>
</template>
<script setup lang="ts">
const props = defineProps({
md: {
type: [String, Number],
default: null,
},
lg: {
type: [String, Number],
default: null,
},
})
const spanMap: Record<string, string> = {
'1': 'col-span-1',
'2': 'col-span-2',
'3': 'col-span-3',
'4': 'col-span-4',
}
const itemClass = computed(() => {
const classes = [] as string[]
if (props.md && spanMap[String(props.md)]) classes.push(`md:${spanMap[String(props.md)]}`)
if (props.lg && spanMap[String(props.lg)]) classes.push(`lg:${spanMap[String(props.lg)]}`)
return classes.join(' ')
})
</script>