From 0cb6960f0c65c0d791ccdee2f5bc2e2b910cfb76 Mon Sep 17 00:00:00 2001
From: Joe Carstairs <118172583+jcarstairs-scottlogic@users.noreply.github.com>
Date: Fri, 19 Jan 2024 09:16:42 +0000
Subject: Uses SCSS partials (#64)

---
 scss/layout/_grid.xs.scss | 55 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 scss/layout/_grid.xs.scss

(limited to 'scss/layout/_grid.xs.scss')

diff --git a/scss/layout/_grid.xs.scss b/scss/layout/_grid.xs.scss
new file mode 100644
index 0000000..e7c6d1a
--- /dev/null
+++ b/scss/layout/_grid.xs.scss
@@ -0,0 +1,55 @@
+.grid-span-2 {
+  width: calc(var(--grid-column-width) * 2 + var(--grid-gutter-width));
+}
+
+.grid-span-3 {
+  width: calc(var(--grid-column-width) * 3 + var(--grid-gutter-width) * 2);
+}
+
+.grid-span-1.grid-end {
+  margin-inline-start: calc(
+    var(--grid-column-width) * (var(--grid-column-count) - 1) +
+    var(--grid-gutter-width) * (var(--grid-column-count) - 1)
+  );
+  margin-inline-end: 0;
+}
+
+.grid-span-2.grid-end {
+  margin-inline-start: calc(
+    var(--grid-column-width) * (var(--grid-column-count) - 2) +
+    var(--grid-gutter-width) * (var(--grid-column-count) - 2)
+  );
+  margin-inline-end: 0;
+}
+
+.grid-span-3.grid-end {
+  margin-inline-start: calc(
+    var(--grid-column-width) * (var(--grid-column-count) - 3) +
+    var(--grid-gutter-width) * (var(--grid-column-count) - 3)
+  );
+  margin-inline-end: 0;
+}
+
+.grid-span-1.grid-prose-end {
+  margin-inline-start: calc(
+    var(--grid-column-width) * (var(--grid-prose-column-count) - 1) +
+    var(--grid-gutter-width) * (var(--grid-prose-column-count) - 1)
+  );
+  margin-inline-end: 0;
+}
+
+.grid-span-2.grid-prose-end {
+  margin-inline-start: calc(
+    var(--grid-column-width) * (var(--grid-prose-column-count) - 2) +
+    var(--grid-gutter-width) * (var(--grid-prose-column-count) - 2)
+  );
+  margin-inline-end: 0;
+}
+
+.grid-span-3.grid-prose-end {
+  margin-inline-start: calc(
+    var(--grid-column-width) * (var(--grid-prose-column-count) - 3) +
+    var(--grid-gutter-width) * (var(--grid-prose-column-count) - 3)
+  );
+  margin-inline-end: 0;
+}
\ No newline at end of file
-- 
cgit v1.2.3