79 lines
1.3 KiB
Vue
79 lines
1.3 KiB
Vue
<template>
|
|
<div class="default">
|
|
<!-- <Carousel v-show="!loading" class="child"> -->
|
|
<Changelog/>
|
|
<!-- <History/>
|
|
<Advice/>
|
|
</Carousel> -->
|
|
<p v-show="loading" class="loading">
|
|
<Icon icon="fa-spinner fa-solid" spin-pulse/> Chargement en cours
|
|
</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import Welcome from './Home/Welcome.vue';
|
|
import Carousel from '@/components/UI/Carousel.vue';
|
|
import Changelog from './Home/Changelog.vue';
|
|
import Advice from './Home/Advice.vue';
|
|
import History from './Home/History.vue';
|
|
|
|
import { ref } from 'vue';
|
|
import Events from '@/utils/Events';
|
|
|
|
const loading = ref(true);
|
|
|
|
Events.on("CHANGELOG_LOADED", () => {
|
|
loading.value = false;
|
|
});
|
|
|
|
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
.textSecond {
|
|
font-size: 0.8em;
|
|
color: var(--text-secondary);
|
|
opacity: 0.8;
|
|
|
|
}
|
|
|
|
p {
|
|
margin: 0 0 0.5em 0;
|
|
font-size: 1.5em;
|
|
font-weight: 600;
|
|
|
|
}
|
|
|
|
.default {
|
|
display: grid;
|
|
grid-template-rows: 1fr;
|
|
grid-template-columns: 1fr;
|
|
gap: 5px;
|
|
flex: 1;
|
|
}
|
|
|
|
@media screen and (max-width: 768px),
|
|
screen and (max-height: 607px) {
|
|
.default {
|
|
grid-template-rows: 1fr;
|
|
}
|
|
}
|
|
|
|
.child {
|
|
grid-column: 1 / -1;
|
|
|
|
width: 100%;
|
|
}
|
|
|
|
.loading {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 10px;;
|
|
color: var(--text-secondary);
|
|
}
|
|
|
|
</style> |