starting new design by section with home taking all screen height

2023-12-03 15:33:39 +01:00
parent 6b1370131d
commit c21df45857
7 changed files with 315 additions and 456 deletions
--- a/styles/elements/sections.css
+++ b/styles/elements/sections.css
@@ -0,0 +1,33 @@
+
+section header  { grid-area: header; }
+section article { grid-area: article; }
+section footer  { grid-area: footer; }
+
+section {
+	display: grid;
+	margin: 0px;
+	width: 100vw;
+	grid:
+    ' .         header    .        ' 1fr
+    ' .         article   .        ' auto
+    ' footer    footer    footer   ' auto
+	  / 1fr       auto      1fr      ;
+	grid-gap: 10px;
+}
+
+section header {
+	display: flex;
+	flex-direction: column;
+	place-content: center;
+}
+section footer {
+	display: flex;
+	flex-direction: column;
+}
+section header h1 {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: center;
+}
+