From 91ab08522d77fd4d8e414d2314a031fe2ec5399c Mon Sep 17 00:00:00 2001
From: Charlotte <charlotte.emms@theguardian.com>
Date: Tue, 28 May 2024 14:57:36 +0100
Subject: [PATCH] include CSS classname in slice def

---
 app/slices/Slice.scala | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/app/slices/Slice.scala b/app/slices/Slice.scala
index 98bc8fca668..e4bdf058ed4 100644
--- a/app/slices/Slice.scala
+++ b/app/slices/Slice.scala
@@ -906,8 +906,16 @@ case object ShowcaseSingleStories extends Slice {
 
 
 /*
- * The Highlights layout is used to display select features above the title piece for apps and web
+ * The Highlights layout is used to display select features in the header for apps and web
  * 
+ * Desktop:
+ * .____________.____________.____________.
+ * |       #####|       #####|       #####|
+ * |       #####|       #####|       #####|
+ * |       #####|       #####|       #####|
+ * '--------------------------------------'
+ * 
+ * Mobile:
  * .___________.___________.___________.
  * |           |           |           |
  * |           |           |           |
@@ -918,27 +926,27 @@ case object ShowcaseSingleStories extends Slice {
  */
 case object Highlights extends Slice {
   val layout = SliceLayout(
-    // cssClassName = "t-t-t",
+    cssClassName = "t-t-t",
     columns = Seq(
       SingleItem(
         colSpan = 1,
         ItemClasses(
-          mobile = Half,
-          tablet = Third
+          mobile = Standard,
+          tablet = MediaList
         )
       ),
       SingleItem(
         colSpan = 1,
         ItemClasses(
-          mobile = Half,
-          tablet = Third
+          mobile = Standard,
+          tablet = MediaList
         )
       ),
       SingleItem(
         colSpan = 1,
         ItemClasses(
-          mobile = Half,
-          tablet = Third
+          mobile = Standard,
+          tablet = MediaList
         )
       )
     )