diff --git a/index.html b/index.html
index 6ec887a..134ec49 100644
--- a/index.html
+++ b/index.html
@@ -1,22 +1,25 @@
-
-
-
- cyclocrust
-
-
-
-

-
-
cyclocrust
-
-
+
+
+
+ cyclocrust
+
+
+
+
+ main content
+
+
diff --git a/package-lock.json b/package-lock.json
index 8fdf08c..7307fe5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -409,7 +409,6 @@
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
"integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
"license": "MIT",
- "peer": true,
"dependencies": {
"anymatch": "~3.1.2",
"braces": "~3.0.2",
@@ -1257,7 +1256,6 @@
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
"license": "MIT",
- "peer": true,
"engines": {
"node": ">=12"
},
@@ -1279,7 +1277,6 @@
"resolved": "https://registry.npmjs.org/posthtml/-/posthtml-0.16.7.tgz",
"integrity": "sha512-7Hc+IvlQ7hlaIfQFZnxlRl0jnpWq2qwibORBhQYIb0QbNtuicc5ZxvKkVT71HJ4Py1wSZ/3VR1r8LfkCtoCzhw==",
"license": "MIT",
- "peer": true,
"dependencies": {
"posthtml-parser": "^0.11.0",
"posthtml-render": "^3.0.0"
diff --git a/static/css/base.css b/static/css/base.css
index 0f4913f..95ae0a1 100644
--- a/static/css/base.css
+++ b/static/css/base.css
@@ -1,35 +1,53 @@
body {
- background: black;
+ background: black;
+ display: grid;
+ grid-template-columns: minmax(1em, 20%) repeat(6, 1fr) minmax(1em, 20%);
+ grid-template-rows: max-content auto;
+ color: white;
+ gap: 2em 0;
}
-.main {
- display: grid;
- grid-template-columns: repeat(8, 1fr);
- grid-template-rows: repeat(8, 1fr);
- height: 100vh;
+.head, .main {
+ display: grid;
+ grid-template-rows: subgrid;
+ grid-column: 2/8;
}
-.main h1 {
- grid-column: 3/7;
- grid-row: 2/3;
- color: white;
- font-size: clamp(100%, 1rem + 8vw, 200px);
+.head {
+ grid-row: 1/2;
+ grid-template-columns: min-content max-content auto;
+ padding-top: 2em;
+ gap: 1em;
+ align-items: center;
+}
+
+.head > .logo > svg {
+ display: block;
+ fill: white;
+ height: auto;
+ width: 100px;
}
-.hero {
- grid-column: 1/-1;
- grid-row: 1/-1;
- width: 100%;
- height: 100%;
- object-fit: cover;
+.head > .logo {
+ grid-column: 1/2;
}
-.logo {
- fill: white;
- grid-column: 3/7;
- grid-row: 3/-1;
+.head > h1 {
+ color: white;
+ grid-column: 2/3;
}
-.logo > svg {
- display: block;
+.head > ul {
+ grid-column: 3/4;
+ list-style: "";
+ justify-self: end;
}
+
+.head .links a {
+ color: white;
+}
+
+.main {
+ grid-row: 2/-1;
+}
+
diff --git a/static/css/reset.css b/static/css/reset.css
index 6374cb1..c98df43 100644
--- a/static/css/reset.css
+++ b/static/css/reset.css
@@ -13,3 +13,7 @@ p {
h1, h2, h3, h4, h5, h6 {
text-wrap: balance;
}
+
+ul {
+ padding: 0;
+}