<template>
<div class="relative min-h-screen bg-gradient-to-r from-purple-100 via-pink-200 to-purple-100">
<Navbar />
<img src="./assets/img/cont_corner_topl.png" alt="Top Image" class="top-image noselect" draggable="false" />
<img src="./assets/img/cont_corner_bottomr.png" alt="Down Image" class="down-image noselect" draggable="false" />
<NuxtPage />
</div>
</template>
<script setup>
useHead({
title: "麗奈っち // reinacchi",
link: [
{
rel: "stylesheet",
href: "https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css",
},
],
});
</script>
<style>
.top-image {
@apply absolute top-0 left-0 w-64 h-64;
}
.down-image {
@apply absolute bottom-0 right-0 w-64 h-64;
}
@media (min-width: 768px) {
.top-image {
@apply w-96 h-96;
}
.down-image {
@apply w-96 h-96;
}
}
</style>
<template>
<div class="relative min-h-screen bg-gradient-to-r from-purple-100 via-pink-200 to-purple-100">
<Navbar />
<img src="./assets/img/cont_corner_topl.png" alt="Top Image" class="top-image noselect" draggable="false" />
<img src="./assets/img/cont_corner_bottomr.png" alt="Down Image" class="down-image noselect" draggable="false" />
<NuxtPage />
</div>
</template>
<script setup>
useHead({
title: "麗奈っち // reinacchi",
link: [
{
rel: "stylesheet",
href: "https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css",
},
],
});
</script>
<style>
.top-image {
@apply absolute top-0 left-0 w-64 h-64;
}
.down-image {
@apply absolute bottom-0 right-0 w-64 h-64;
}
@media (min-width: 768px) {
.top-image {
@apply w-96 h-96;
}
.down-image {
@apply w-96 h-96;
}
}
</style>