From f62106c14559bbf541bacfca99dc29571d6c8066 Mon Sep 17 00:00:00 2001
From: Joe Carstairs <65492573+Sycamost@users.noreply.github.com>
Date: Sun, 20 Aug 2023 08:13:21 +0100
Subject: Content grid is centred on mobile screens

---
 public/css/layout/grid.css | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

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

diff --git a/public/css/layout/grid.css b/public/css/layout/grid.css
index 2ca5b21..fc7ccee 100644
--- a/public/css/layout/grid.css
+++ b/public/css/layout/grid.css
@@ -4,13 +4,18 @@
   nav,
   :is(main, article) > section:not(:is(section, header) :is(section, header))
 ) {
-  padding-inline-start: var(--grid-padding-start);
-  padding-inline-end: calc(
+  padding-inline-start: calc(0.5 * (
+    100vw - (var(--grid-padding-start) + (
+      var(--grid-column-width) * var(--grid-column-count) +
+      var(--grid-gutter-width) * (var(--grid-column-count) - 1)
+    )
+  )));
+  padding-inline-end: calc(0.5 * (
     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 {
-- 
cgit v1.2.3