From 9263cdf0539af47c9a1347be8b7b7ebdbb2dfe28 Mon Sep 17 00:00:00 2001
From: Colin Rotherham <work@colinr.com>
Date: Fri, 21 Feb 2025 18:02:34 +0000
Subject: [PATCH] Add tablet specific grid classes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Inspired by “desktop specific grid classs” in: https://github.com/alphagov/govuk-frontend/pull/1094
---
 packages/core/objects/_grid.scss | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/packages/core/objects/_grid.scss b/packages/core/objects/_grid.scss
index a20243cae..ed5f12504 100644
--- a/packages/core/objects/_grid.scss
+++ b/packages/core/objects/_grid.scss
@@ -11,6 +11,15 @@
     margin-left: -($nhsuk-gutter-half);
   }
 
+  // These *must* be defined in a separate loop as they have the same
+  // specificity as the non-breakpoint specific classes, so need to appear before
+  // them in the outputted CSS
+  @each $width in map-keys($nhsuk-grid-widths) {
+    .nhsuk-grid-column-#{$width}-from-tablet {
+      @include govuk-grid-column($width, $at: tablet, $class: false);
+    }
+  }
+
   @each $width in map-keys($nhsuk-grid-widths) {
     .nhsuk-grid-column-#{$width} {
       @include govuk-grid-column($width, $class: false);