generated from Seekra/repository-template
Add check whether there is a sidebar component in the base layout
This commit is contained in:
@@ -1,10 +1,19 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import Sidebar from '@/features/sidebar/components/Sidebar.vue';
|
import Sidebar from '@/features/sidebar/components/Sidebar.vue';
|
||||||
|
|
||||||
|
import { computed, useSlots } from 'vue';
|
||||||
|
|
||||||
|
const slots = useSlots();
|
||||||
|
|
||||||
|
const hasSidebarSlot = computed(() => !!slots.sidebar);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="layout-container">
|
<div
|
||||||
<div>
|
class="layout-container"
|
||||||
|
:style="{ 'grid-template-columns': `${hasSidebarSlot ? 'minmax(auto, 340px) ' : ''}1fr` }"
|
||||||
|
>
|
||||||
|
<div v-if="hasSidebarSlot">
|
||||||
<Sidebar>
|
<Sidebar>
|
||||||
<slot name="sidebar" />
|
<slot name="sidebar" />
|
||||||
</Sidebar>
|
</Sidebar>
|
||||||
@@ -18,6 +27,5 @@ import Sidebar from '@/features/sidebar/components/Sidebar.vue';
|
|||||||
<style scoped>
|
<style scoped>
|
||||||
.layout-container {
|
.layout-container {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: minmax(auto, 340px) 1fr;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user