From 6300a2d6966dfd5bf1e48808d8c8c1ceab7610c5 Mon Sep 17 00:00:00 2001
From: Frankie B <git@diskfloppy.me>
Date: Tue, 15 Aug 2023 00:13:53 +0100
Subject: Improve table accessibility

---
 public/css/master.css                           | 10 ++++++
 resources/views/pages/admin/guestbook.blade.php |  2 +-
 resources/views/pages/bookmarks.blade.php       | 14 +++------
 resources/views/pages/home.blade.php            | 42 +++++++------------------
 resources/views/pages/weather.blade.php         | 14 +++------
 5 files changed, 31 insertions(+), 51 deletions(-)

diff --git a/public/css/master.css b/public/css/master.css
index 347d65c..dffc9ad 100644
--- a/public/css/master.css
+++ b/public/css/master.css
@@ -416,6 +416,7 @@ table.gb-admin tr td.gb-message {
     border-top: none;
     vertical-align: top;
     padding: 5px;
+    column-span: 2;
 }
 
 table.infotable tr td {
@@ -430,6 +431,15 @@ table.infotable tr td small {
     margin: 0;
 }
 
+caption h1,
+caption h2 {
+    margin: 0;
+}
+
+caption {
+    text-align: left;
+}
+
 table.infotable tr td small {
     margin-bottom: 5px;
 }
diff --git a/resources/views/pages/admin/guestbook.blade.php b/resources/views/pages/admin/guestbook.blade.php
index d510910..85460cc 100644
--- a/resources/views/pages/admin/guestbook.blade.php
+++ b/resources/views/pages/admin/guestbook.blade.php
@@ -22,7 +22,7 @@
                 </td>
             </tr>
             <tr>
-                <td colspan="2" class="gb-message">
+                <td class="gb-message">
                     <br>
                     {{ htmlspecialchars($entry->message) }}
                 </td>
diff --git a/resources/views/pages/bookmarks.blade.php b/resources/views/pages/bookmarks.blade.php
index cbc67ee..01d11bc 100644
--- a/resources/views/pages/bookmarks.blade.php
+++ b/resources/views/pages/bookmarks.blade.php
@@ -13,16 +13,10 @@
     @foreach ($categories as $category)
         <table class="infotable">
 
-            <tr>
-                <td colspan="2">
-                    <h1>{{ $category->name }}</h1>
-                </td>
-            </tr>
-            <tr>
-                <td colspan="2">
-                    <hr>
-                </td>
-            </tr>
+            <caption>
+                <h1>{{ $category->name }}</h1>
+                <hr>
+            </caption>
 
             @php
                 $sites = DB::select(
diff --git a/resources/views/pages/home.blade.php b/resources/views/pages/home.blade.php
index 89849b3..5a61de8 100644
--- a/resources/views/pages/home.blade.php
+++ b/resources/views/pages/home.blade.php
@@ -8,16 +8,10 @@
     </div>
 
     <table class="infotable">
-        <tr>
-            <td>
-                <h1>Fun Facts</h1>
-            </td>
-        </tr>
-        <tr>
-            <td>
-                <hr>
-            </td>
-        </tr>
+        <caption>
+            <h1>Fun Facts</h1>
+            <hr>
+        </caption>
         <tr>
             <td>&#9670; I am (unfortunately) British</td>
         </tr>
@@ -34,16 +28,10 @@
     <br>
 
     <table class="infotable">
-        <tr>
-            <td colspan="2">
-                <h1>Interests</h1>
-            </td>
-        </tr>
-        <tr>
-            <td colspan="2">
-                <hr>
-            </td>
-        </tr>
+        <caption>
+            <h1>Interests</h1>
+            <hr>
+        </caption>
         <tr>
             <td>&#9670; <b>Tech Theatre</b></td>
             <td>- Lighting, Stage Management, etc.</td>
@@ -60,16 +48,10 @@
     <br>
 
     <table class="infotable">
-        <tr>
-            <td colspan="2">
-                <h1>Contact &amp; social</h1>
-            </td>
-        </tr>
-        <tr>
-            <td colspan="2">
-                <hr>
-            </td>
-        </tr>
+        <caption>
+            <h1>Contact &amp; social</h1>
+            <hr>
+        </caption>
         <tr>
             <td><strong>E-mail:</strong></td>
             <td><a href="mailto:contact@diskfloppy.me">contact@diskfloppy.me</a></td>
diff --git a/resources/views/pages/weather.blade.php b/resources/views/pages/weather.blade.php
index 40a89f5..6f67b80 100644
--- a/resources/views/pages/weather.blade.php
+++ b/resources/views/pages/weather.blade.php
@@ -18,16 +18,10 @@ $updated = gmdate('H:i Y-m-d', $data->updated);
 $data = $data->current;
 @endphp
 <table class="infotable">
-    <tr>
-        <td colspan="2">
-            <h1>Local Weather</h1>
-        </td>
-    </tr>
-    <tr>
-        <td colspan="2">
-            <hr>
-        </td>
-    </tr>
+    <caption>
+        <h1>Local Weather</h1>
+        <hr>
+    </caption>
     <tr>
         <td><b>Wind Speed:</b></td>
         <td>{{ $data->wind->speed }} mph</td>
-- 
cgit v1.2.3-54-g00ecf