From 2716256c665e39b0e217dac1f3bb560a14c101e1 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Sun, 24 Oct 2021 18:19:05 +0200
Subject: chore: add styles

---
 htdocs/src/scss/layout/_grid.scss | 44 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 44 insertions(+)
 create mode 100644 htdocs/src/scss/layout/_grid.scss

(limited to 'htdocs/src/scss/layout/_grid.scss')

diff --git a/htdocs/src/scss/layout/_grid.scss b/htdocs/src/scss/layout/_grid.scss
new file mode 100644
index 0000000..5a61f1a
--- /dev/null
+++ b/htdocs/src/scss/layout/_grid.scss
@@ -0,0 +1,44 @@
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
+
+.body {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  grid-template-rows: minmax(0, 1fr) max-content;
+  height: 100vh;
+  position: relative;
+
+  @include mix.media("screen") {
+    @include mix.dimensions("lg") {
+      grid-template-columns: 1.5fr 4fr;
+    }
+
+    @include mix.dimensions("xl") {
+      grid-template-columns: 1fr 4fr;
+    }
+  }
+}
+
+.header {
+  grid-column: 1;
+  grid-row: 1;
+  overflow-y: auto;
+  width: 100%;
+}
+
+.main {
+  grid-column: 1;
+  grid-row: 1 / -1;
+
+  @include mix.media("screen") {
+    @include mix.dimensions("lg") {
+      grid-column: 2;
+    }
+  }
+}
+
+.footer {
+  grid-column: 1;
+  grid-row: 2;
+  width: 100%;
+}
-- 
cgit v1.2.3