From c8698c4151660b7298871d72763b25e92366eb22 Mon Sep 17 00:00:00 2001
From: ay8s <contact@andydev.co.uk>
Date: Sat, 4 Jan 2025 16:52:33 -0800
Subject: [PATCH] Remove wobble

---
 src/components/Race/Race.tsx | 24 ++++++++++++------------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/Race/Race.tsx b/src/components/Race/Race.tsx
index 81829390..eb443245 100644
--- a/src/components/Race/Race.tsx
+++ b/src/components/Race/Race.tsx
@@ -98,16 +98,18 @@ const Race = ({
             <Toggle collapsed={collapsed} />
           </div>
         </td>
-        <th className={`flex p-4`} id={`${item.slug}-header`}>
-          <span className={`${titleRowClasses(race)} flex`}>
-            <span className={titleRowTextClasses(race)}>{raceTitle}</span>
-
-            {isNextRace && !item.tbc && !item.canceled && <NextBadge />}
+        <th
+          className={`flex p-4 flex justify-between lg:pr-8`}
+          id={`${item.slug}-header`}
+        >
+          <div className={`${titleRowClasses(race)}`}>
+            <div className={titleRowTextClasses(race)}>{raceTitle}</div>
+          </div>
+          {isNextRace && !item.tbc && !item.canceled && <NextBadge />}
 
-            {item.tbc && <TBCBadge />}
+          {item.tbc && <TBCBadge />}
 
-            {item.canceled && <CanceledBadge />}
-          </span>
+          {item.canceled && <CanceledBadge />}
         </th>
         {!hasMultipleFeaturedEvents ? (
           <>
@@ -179,13 +181,11 @@ const Race = ({
 
       keys.forEach(function (sessionKey, index) {
         // Translate session title or fallback to session key
-        
-        
-        
+
         const sessionTitle =
           t(`schedule.${sessionKey}`) != `All.schedule.${sessionKey}`
             ? t(`schedule.${sessionKey}`)
-            : sessionKey.replace(/./,x=>x.toUpperCase())
+            : sessionKey.replace(/./, (x) => x.toUpperCase());
 
         const hasOccured = dayjs(props.item.sessions[sessionKey])
           .add(2, 'hours')