Implement layout (wip)

This commit is contained in:
Akira Tempaku 2024-04-25 17:19:40 +09:00
parent 0f7978cc5c
commit b62a2dd8c4
13 changed files with 69 additions and 36 deletions

View file

@ -0,0 +1,6 @@
@scope ([data-css='components/layout/footer.css']) {
:scope {
height: 40px;
background-color: gray;
}
}

View file

@ -0,0 +1,7 @@
@scope ([data-css='components/layout/header.css']) {
:scope {
height: 80px;
display: flex;
background-color: gray;
}
}

View file

@ -0,0 +1,11 @@
@scope ([data-css='components/layout/main.css']) {
:scope {
height: 100svh;
display: flex;
flex-direction: column;
}
.main {
flex: 1;
}
}

View file

@ -1,12 +1,8 @@
@charset "utf-8";
body {
html {
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
&[data-dark] {
background-color: slategrey;
}
}

View file

@ -1,6 +1,6 @@
@scope ([data-css='pages/index.css']) {
:scope {
height: 100svh;
height: 100%;
display: grid;
place-content: center;
}