chore: add styles

1 files changed, 44 insertions, 0 deletions

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%;
+}