paulnicoue/pages/index.vue
2023-02-02 17:02:53 +01:00

57 lines
1.1 KiB
Vue

<template>
<main>
<HeroSection class="hero-section" />
<ContactSection class="contact-section" />
</main>
</template>
<script setup>
// --------------------------------------------------
// HEAD
// --------------------------------------------------
definePageMeta({
pageTitleChunk: null
})
</script>
<style lang="scss" scoped>
// --------------------------------------------------
// STYLE
// --------------------------------------------------
main {
width: 100%;
padding: 0 2rem;
display: grid;
grid:
'hero-section' auto
'contact-section' auto
/ 1fr;
place-content: start center;
place-items: start center;
row-gap: 4rem;
.hero-section {
grid-area: hero-section;
}
.contact-section {
grid-area: contact-section;
}
@media screen and (min-width: $tablet-media-query) {
padding: 0 4rem;
}
@media screen and (min-width: $desktop-media-query) {
padding: 0 6rem;
}
}
</style>