From d99623d77386df97ca29fc0ff43d24ae0f090beb Mon Sep 17 00:00:00 2001
From: timotheegoguely <timothee@goguely.com>
Date: Thu, 12 Sep 2024 19:08:20 +0200
Subject: [PATCH] Add CSS wrapper and position utilities

---
 src/assets/css/index.css                    |  2 ++
 src/assets/css/src/3.utilities.position.css | 23 +++++++++++++++++++++
 src/assets/css/src/3.utilities.wrapper.css  | 12 +++++++++++
 3 files changed, 37 insertions(+)
 create mode 100644 src/assets/css/src/3.utilities.position.css
 create mode 100644 src/assets/css/src/3.utilities.wrapper.css

diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index 7c15831..f233e58 100644
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@@ -25,7 +25,9 @@
 @import 'src/3.utilities.flow.css';
 @import 'src/3.utilities.icons.css';
 @import 'src/3.utilities.overflow.css';
+@import 'src/3.utilities.position.css';
 @import 'src/3.utilities.screen-readers.css';
 @import 'src/3.utilities.size.css';
 @import 'src/3.utilities.spacing.css';
 @import 'src/3.utilities.text.css';
+@import 'src/3.utilities.wrapper.css';
diff --git a/src/assets/css/src/3.utilities.position.css b/src/assets/css/src/3.utilities.position.css
new file mode 100644
index 0000000..ff7e3f1
--- /dev/null
+++ b/src/assets/css/src/3.utilities.position.css
@@ -0,0 +1,23 @@
+/* POSITION UTILITY */
+
+.relative {
+	position: relative;
+}
+.absolute {
+	position: absolute;
+}
+.sticky {
+	position: -webkit-sticky;
+	position: sitcky;
+}
+.fixed {
+	position: fixed;
+}
+
+.inset-0  { inset:  0 }
+.top-0    { top:    0 }
+.bottom-0 { bottom: 0 }
+.left-0   { left:   0 }
+.right-0  { right:  0 }
+
+.-z-1 { z-index: -1 }
diff --git a/src/assets/css/src/3.utilities.wrapper.css b/src/assets/css/src/3.utilities.wrapper.css
new file mode 100644
index 0000000..acc7dab
--- /dev/null
+++ b/src/assets/css/src/3.utilities.wrapper.css
@@ -0,0 +1,12 @@
+/* WRAPPER UTILITY */
+
+.wrapper {
+  margin-left: auto;
+  margin-right: auto;
+  width: 100%;
+  max-width: var(--wrapper-max-width, 100rem);
+  padding-left: var(--gutter);
+  padding-right: var(--gutter);
+  position: relative;
+  z-index: 1;
+}