From a76fd2721ebea4172d4dc33da1f47ad57679d03e Mon Sep 17 00:00:00 2001
From: Joe Carstairs <65492573+Sycamost@users.noreply.github.com>
Date: Sat, 19 Aug 2023 20:43:00 +0100
Subject: Defines grid columns spacing

---
 public/css/layout/grid.css | 36 ++++++++++++++++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 public/css/layout/grid.css

(limited to 'public/css/layout/grid.css')

diff --git a/public/css/layout/grid.css b/public/css/layout/grid.css
new file mode 100644
index 0000000..b4bc240
--- /dev/null
+++ b/public/css/layout/grid.css
@@ -0,0 +1,36 @@
+:is(main, article, header, footer, nav) {
+  padding-inline-start: var(--grid-padding-start);
+  padding-inline-end: calc(
+    100vw - (var(--grid-padding-start) + (
+      var(--grid-column-width) * var(--grid-column-count) +
+      var(--grid-gutter-width) * (var(--grid-column-count) - 1)
+    ))
+  );
+}
+
+.grid-span-1 {
+  width: var(--grid-column-width);
+}
+
+.grid-span-2 {
+  width: calc(var(--grid-column-width) * 2 + var(--grid-gutter-width));
+}
+
+.grid-span-6 {
+  width: calc(
+    var(--grid-column-width) * min(6, var(--grid-column-count)) +
+    var(--grid-gutter-width) * min(5, (var(--grid-column-count) - 1))
+  );
+}
+
+.grid-span-full {
+  width: calc(
+    var(--grid-column-width) * var(--grid-column-count) +
+    var(--grid-gutter-width) * (var(--grid-column-count) - 1)
+  )
+}
+
+.grid-end-end {
+  margin-inline-start: auto;
+  margin-inline-end: 0;
+}
\ No newline at end of file
-- 
cgit v1.2.3