Implement layout (wip)
This commit is contained in:
parent
0f7978cc5c
commit
b62a2dd8c4
13 changed files with 69 additions and 36 deletions
assets/css
6
assets/css/components/layout/footer.css
Normal file
6
assets/css/components/layout/footer.css
Normal file
|
@ -0,0 +1,6 @@
|
|||
@scope ([data-css='components/layout/footer.css']) {
|
||||
:scope {
|
||||
height: 40px;
|
||||
background-color: gray;
|
||||
}
|
||||
}
|
7
assets/css/components/layout/header.css
Normal file
7
assets/css/components/layout/header.css
Normal file
|
@ -0,0 +1,7 @@
|
|||
@scope ([data-css='components/layout/header.css']) {
|
||||
:scope {
|
||||
height: 80px;
|
||||
display: flex;
|
||||
background-color: gray;
|
||||
}
|
||||
}
|
11
assets/css/components/layout/main.css
Normal file
11
assets/css/components/layout/main.css
Normal file
|
@ -0,0 +1,11 @@
|
|||
@scope ([data-css='components/layout/main.css']) {
|
||||
:scope {
|
||||
height: 100svh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.main {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
@scope ([data-css='pages/index.css']) {
|
||||
:scope {
|
||||
height: 100svh;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue