salix-front/src/components/ui/VnRow.vue

27 lines
461 B
Vue

<script setup>
defineProps({ wrap: { type: Boolean, default: false } });
</script>
<template>
<div class="vn-row q-gutter-md q-mb-md">
<slot />
</div>
</template>
<style lang="scss" scoped>
.vn-row {
display: flex;
> :deep(*) {
flex: 1;
}
&[wrap] {
flex-wrap: wrap;
}
}
@media screen and (max-width: 800px) {
.vn-row {
&:not(.wrap) {
flex-direction: column;
}
}
}
</style>