Create Terms page

2022-08-20 23:19:19 +02:00
parent d7cab1f013
commit 1452edaa83
3 changed files with 117 additions and 0 deletions
--- a/src/style/pages/_terms.scss
+++ b/src/style/pages/_terms.scss
@@ -0,0 +1,59 @@
+.terms {
+    // Categories
+    &__categories {
+        .container {
+            display: block;
+
+            @include bp (sm) {
+                display: grid;
+            }
+
+            & > * {
+                margin-bottom: clamp(40px, 5vw, 72px);
+            }
+        }
+    }
+
+    // Section
+    &__section {
+        --columns: 16;
+        display: block;
+        padding: 0 20px;
+
+        @include bp (sm) {
+            display: grid;
+            align-items: baseline;
+            grid-column: 3 / -3;
+        }
+        @include bp (sd) {
+            grid-column: 5 / -5;
+        }
+
+        h2 {
+            margin-bottom: 0.75em;
+            color: $color-secondary-light;
+            line-height: 1.1;
+
+            @include bp (sm) {
+                position: sticky;
+                top: clamp(24px, 3vw, 40px);
+                grid-column: 1 / span 4;
+                margin-bottom: 0;
+                text-align: right;
+            }
+            @include bp (sd) {
+                grid-column: 1 / span 6;
+            }
+        }
+        .text {
+            color: $color-tertiary;
+
+            @include bp (sm) {
+                grid-column: 6 / -1;
+            }
+            @include bp (sd) {
+                grid-column: 8 / -1;
+            }
+        }
+    }
+}