From b292cd39bf5e5c2d96f2f64eb1a94d8fd63fae9e Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Mon, 22 Mar 2021 20:52:20 +0100
Subject: WIP: Redesign

---
 assets/css/layouts/_landing.scss | 60 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 60 insertions(+)
 create mode 100644 assets/css/layouts/_landing.scss

(limited to 'assets/css/layouts/_landing.scss')

diff --git a/assets/css/layouts/_landing.scss b/assets/css/layouts/_landing.scss
new file mode 100644
index 0000000..b824005
--- /dev/null
+++ b/assets/css/layouts/_landing.scss
@@ -0,0 +1,60 @@
+@include namespace('landing') {
+    @include store((
+        --dims: (
+            --banner-width: 30rem,
+        ),
+        --colors: (
+            --banner-bg: prop(--colors --bg, $global: true)
+        )
+    ));
+
+    @include layout(namespace()) {
+        display:        flex;
+        flex-direction: row;
+        align-items:    center;
+        min-height:     100%;
+
+        @include element('banner') {
+            flex-shrink:      1.2;
+            width:            100%;
+            max-width:        prop(--dims --banner-width);
+            background-color: prop(--colors --banner-bg);
+        }
+
+        @include element('content') {
+            width:     100%;
+            min-width: 0;
+        }
+
+        @include iro-responsive-env(('md', 'lg')) {
+            @include element('banner') {
+                padding:
+                    iro-responsive-set((2rem, 6rem))
+                    iro-responsive-set((0, 6rem));
+            }
+    
+            @include element('content') {
+                padding:
+                    iro-responsive-set((2rem, 6rem))
+                    iro-responsive-set((0, 6rem))
+                    iro-responsive-set((2rem, 6rem))
+                    0;
+            }
+        }
+
+        @include media('<=md') {
+            display: block;
+            height:  auto;
+
+            @include element('banner', 'content') {
+                width:         auto;
+                padding-right: 0;
+                padding-left:  0;
+            }
+
+            @include element('banner') {
+                max-width: none;
+            }
+        }
+    }
+}
-- 
cgit v1.2.3-54-g00ecf