44 lines
1 KiB
Vue
44 lines
1 KiB
Vue
<template>
|
|
<div class="flex col" id="app">
|
|
<header class="flex align-center">
|
|
<div class="flex flex1 align-center gap-small">
|
|
<!-- <img src="/img/logo.png" alt="logo application" class="app-logo" /> -->
|
|
<div>
|
|
<h1>Ptits Lutins</h1>
|
|
<span class="subtitle">{{ $t("layout.subtitle") }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex align-center gap-small">
|
|
<!-- user name and logo-->
|
|
<span>Bousolle Farceur</span>
|
|
<Icon name="carbon:user-avatar" size="2rem" />
|
|
</div>
|
|
</header>
|
|
<main class="flex1 flex col"><slot /></main>
|
|
<div id="background"></div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const { locales, setLocale } = useI18n()
|
|
</script>
|
|
|
|
<style scoped>
|
|
header {
|
|
padding: 1rem;
|
|
border-bottom: 1px solid var(--neutral-30);
|
|
background: var(--app-background);
|
|
}
|
|
|
|
.app-logo {
|
|
width: 4rem;
|
|
height: 4rem;
|
|
border-radius: 80px 0px 0px 80px;
|
|
border: 1px solid #00004c;
|
|
}
|
|
|
|
h1 {
|
|
line-height: 1em;
|
|
font-size: 1.5rem;
|
|
}
|
|
</style>
|