From c7140be2eee679a7fc92fdf8c3ee10fdfa54a3b4 Mon Sep 17 00:00:00 2001
From: asayee <asa.yee@gov.tt>
Date: Mon, 15 Dec 2025 13:33:33 -0400
Subject: [PATCH] Updated schedule responsiveness

---
 resources/views/form/cohorts.blade.php | 62 +++++++++++++-------------
 1 file changed, 32 insertions(+), 30 deletions(-)

diff --git a/resources/views/form/cohorts.blade.php b/resources/views/form/cohorts.blade.php
index 542801c..2173232 100644
--- a/resources/views/form/cohorts.blade.php
+++ b/resources/views/form/cohorts.blade.php
@@ -1,33 +1,35 @@
 <div>
     <h2 class="font-bold text-gray-900 mb-2">This course will be delivered in 3 cohorts, Tuesday and Thursdays from 3:00pm to 6:00pm.</h2>
-    <table class="min-w-full bg-white border border-gray-200 rounded-lg shadow-sm">
-        <thead class="bg-gray-50">
-            <tr>
-                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Cohort</th>
-                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Date</th>
-                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Time</th>
-                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Venue</th>
-            </tr>
-        </thead>
-        <tbody class="divide-y divide-gray-200">
-            <tr class="hover:bg-gray-50">
-                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">1</td>
-                <td class="px-6 py-4 text-sm text-gray-900">Tuesday 14th October &<br>Thursday 16th October 2025</td>
-                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">3:00pm – 6:00pm</td>
-                <td class="px-6 py-4 text-sm text-gray-900">Los Bajos Youth Development Centre</td>
-            </tr>
-            <tr class="hover:bg-gray-50">
-                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">2</td>
-                <td class="px-6 py-4 text-sm text-gray-900">Wednesday 15th October &<br>Wednesday 22nd October 2025</td>
-                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">3:00pm – 6:00pm</td>
-                <td class="px-6 py-4 text-sm text-gray-900">St James Youth Development Centre</td>
-            </tr>
-            <tr class="hover:bg-gray-50">
-                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">3</td>
-                <td class="px-6 py-4 text-sm text-gray-900">Tuesday 21st October &<br>Thursday 23rd October 2025</td>
-                <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">3:00pm – 6:00pm</td>
-                <td class="px-6 py-4 text-sm text-gray-900">California Youth Development Centre</td>
-            </tr>
-        </tbody>
-    </table>
+    <div class="overflow-x-auto">
+        <table class="min-w-full bg-white border border-gray-200 rounded-lg shadow-sm">
+            <thead class="bg-gray-50">
+                <tr>
+                    <th class="px-3 sm:px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Cohort</th>
+                    <th class="px-3 sm:px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Date</th>
+                    <th class="px-3 sm:px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Time</th>
+                    <th class="px-3 sm:px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider border-b border-gray-200">Venue</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-200">
+                <tr class="hover:bg-gray-50">
+                    <td class="px-3 sm:px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">1</td>
+                    <td class="px-3 sm:px-6 py-4 text-sm text-gray-900">Tuesday 14th October &<br>Thursday 16th October 2025</td>
+                    <td class="px-3 sm:px-6 py-4 whitespace-nowrap text-sm text-gray-900">3:00pm – 6:00pm</td>
+                    <td class="px-3 sm:px-6 py-4 text-sm text-gray-900">Los Bajos Youth Development Centre</td>
+                </tr>
+                <tr class="hover:bg-gray-50">
+                    <td class="px-3 sm:px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">2</td>
+                    <td class="px-3 sm:px-6 py-4 text-sm text-gray-900">Wednesday 15th October &<br>Wednesday 22nd October 2025</td>
+                    <td class="px-3 sm:px-6 py-4 whitespace-nowrap text-sm text-gray-900">3:00pm – 6:00pm</td>
+                    <td class="px-3 sm:px-6 py-4 text-sm text-gray-900">St James Youth Development Centre</td>
+                </tr>
+                <tr class="hover:bg-gray-50">
+                    <td class="px-3 sm:px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">3</td>
+                    <td class="px-3 sm:px-6 py-4 text-sm text-gray-900">Tuesday 21st October &<br>Thursday 23rd October 2025</td>
+                    <td class="px-3 sm:px-6 py-4 whitespace-nowrap text-sm text-gray-900">3:00pm – 6:00pm</td>
+                    <td class="px-3 sm:px-6 py-4 text-sm text-gray-900">California Youth Development Centre</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
 </div>
\ No newline at end of file