Files
swingmusic-extended/src/components/FolderView/FolderList.vue
T
2022-02-24 12:23:56 +03:00

46 lines
780 B
Vue

<template>
<div class="f-container rounded" :class="{ no_f: !props.folders.length }">
<div id="f-items" v-if="props.folders.length">
<FolderItem
v-for="folder in props.folders"
:key="folder"
:folder="folder"
/>
</div>
</div>
</template>
<script setup>
import FolderItem from "./FolderItem.vue";
const props = defineProps({
folders: {
type: Array,
required: true,
},
});
</script>
<style lang="scss">
.f-container {
padding: 0 0 0 0;
}
.no_f {
display: none;
}
#f-items {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
gap: $medium;
}
.f-container p {
text-transform: uppercase;
font-weight: normal;
color: rgba(255, 255, 255, 0.438);
margin-bottom: 1rem;
}
</style>