42 lines
841 B
Vue
42 lines
841 B
Vue
<template>
|
|
<div class="page-layout">
|
|
<aside class="sidebar">
|
|
<div class="flex items-center gap-3 px-14 py-4">
|
|
<div class="avatar">
|
|
<div class="h-[155px] w-[155px]">
|
|
<img
|
|
:src="logoSrc"
|
|
alt="Logo Malio"
|
|
class="h-full w-full object-contain"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<slot name="sidebar" />
|
|
</aside>
|
|
<main class="content">
|
|
<slot />
|
|
</main>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import logoSrc from '~/assets/LOGO_CARRE_BLANC.png'
|
|
</script>
|
|
|
|
<style scoped>
|
|
.page-layout {
|
|
display: grid;
|
|
grid-template-columns: 280px 1fr;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.sidebar {
|
|
background-color: rgb(var(--m-primary));
|
|
color: white;
|
|
}
|
|
|
|
.content {
|
|
background-color: rgb(var(--m-tertiary));
|
|
}
|
|
</style>
|