created profilemobile page template and grid

This commit is contained in:
Kostya
2023-12-16 14:50:58 +03:00
parent 704090a5e1
commit 4960d1dbd6
2 changed files with 45 additions and 0 deletions

View File

@@ -0,0 +1,21 @@
body {
overflow-y: scroll;
}
.content-grid__mobile-profile {
display: grid;
grid-auto-columns: 1fr;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(7, 1fr);
grid-template-areas:
"header-mobile header-mobile header-mobile header-mobile"
"profile-mobile profile-mobile profile-mobile profile-mobile"
"profile-mobile profile-mobile profile-mobile profile-mobile"
"footer-mobile footer-mobile footer-mobile footer-mobile";
height: 100%;
width: 100%;
}
.profile-mobile {
grid-area: profile-mobile;
}

View File

@@ -0,0 +1,24 @@
<template>
<div class="content-grid__mobile-profile">
<header-mobile-component></header-mobile-component>
<main class="profile-mobile">
</main>
<menu-mobile-component></menu-mobile-component>
</div>
</template>
<script>
import HeaderMobileComponent from "@/components/adaptive-components/HeaderMobileComponent.vue";
import MenuMobileComponent from "@/components/adaptive-components/MenuMobileComponent.vue";
export default {
components: { HeaderMobileComponent, MenuMobileComponent }
}
</script>
<style scoped>
</style>