Added region.scss and wrapped the site-header__inner in a wrapper

tjaynl · tjaynl · commit 657c47619bac · 2024-03-09T15:23:27.000+01:00
diff --git a/_src/_includes/layouts/home.vto b/_src/_includes/layouts/home.vto
@@ -1,6 +1,6 @@
 ---
 layout: layouts/base.vto
 ---
-<main class="[] [ content-grid ] [ flow ]">
+<main class="[] [ content-grid ] [ region | flow ]">
     {{ content }}
 </main>
diff --git a/_src/_includes/partials/site-header.vto b/_src/_includes/partials/site-header.vto
@@ -1,5 +1,5 @@
 <div class="site-header">
-    <div class="site-header__inner">
+    <div class="site-header__inner wrapper">
         <a class="site-logo" href="/">LOGO</a>
         <nav class="site-nav">
             <ul class="site-nav__list" role="navigation">
diff --git a/_src/_includes/scss/utilities/_index.scss b/_src/_includes/scss/utilities/_index.scss
@@ -1,2 +1,3 @@
 @forward "flow";
+@forward "region";
 @forward "wrapper";
diff --git a/_src/_includes/scss/utilities/_region.scss b/_src/_includes/scss/utilities/_region.scss
@@ -0,0 +1,3 @@
+.region {
+    padding-block: var(--region-space, 6.6vmax);
+}

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+.region {`
	`2`	`+ padding-block: var(--region-space, 6.6vmax);`
	`3`	`+}`