From 84f6205721b276e0df731cf0ba78915daff1fcc8 Mon Sep 17 00:00:00 2001
From: jorge-vitrubio <jorge@vitrubio.net>
Date: Thu, 14 Mar 2024 17:21:02 +0100
Subject: [PATCH] styled header and widths with better solution for scroll and
 possitions

---
 sass/layouts/_no-sidebar.scss | 32 +++++++++++++++++---------------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/sass/layouts/_no-sidebar.scss b/sass/layouts/_no-sidebar.scss
index 1461ebf..0cfbd07 100644
--- a/sass/layouts/_no-sidebar.scss
+++ b/sass/layouts/_no-sidebar.scss
@@ -1,12 +1,24 @@
 @media screen {
 	html:not([data-scroll='0']) {
-		.site-header {
+		.site-header:before {
+			content: "";
+			display:inline-block;
+			position: absolute;
+			width: 100vw;
+			top: 0;
+			left: 50%;
+			right: 50%;
+			margin-left: -50vw;
+			margin-right:-50vw;
+			height: 100%;
+			z-index: -1;
 		  background-color: $color__white;
 		}
 	}
 	.no-sidebar {
 	}
 	.site {
+		position: relative;
 		display: grid;
 		grid-template-columns: auto minmax(min-content, 30em) minmax(min-content, 30em) auto;
 		grid-auto-rows: min-content auto min-content min-content;
@@ -36,14 +48,8 @@
 		position: sticky;
 		top: 0;
 		z-index: 500;
-		display: grid;
-    grid-template-areas:
-		  "main"
-			"secondary ";
-		grid-row: auto;
-    align-items: center;
+		width: 100%;
     padding: 0.5rem 0;
-    width: 100vw;
 		background-color: transparent;
 
 		.main {
@@ -127,7 +133,8 @@
 	.site {
 		//grid-template-columns: 1fr 2fr 2fr 1fr;
 		> header {
-			grid-column: 1 / -1;
+			//grid-column: 1 / -1;
+			grid-column: 2 / 4;
 		}
 		> main {
 			grid-column: 2 / 4;
@@ -140,11 +147,6 @@
 		}
 	}
 	.site-header {
-		display: grid;
-		grid-template-columns: auto minmax(min-content, 30em) minmax(min-content, 30em) auto;
-    grid-template-areas:
-      "main  " 
-      "secondary "; 
     margin: auto;
 		margin-bottom: 2rem;
     padding: 0;
@@ -160,7 +162,7 @@
 		}
 	}
 	.site-main {
-		padding: 0 2rem;
+		padding: 0;
 		> section {
 			padding: 4em 0;
 		}