From a5065d3756ab0392cc4708f271c87615fe4e4f20 Mon Sep 17 00:00:00 2001
From: overflowerror <mail@overflowerror.com>
Date: Tue, 6 Aug 2024 21:50:08 +0200
Subject: [PATCH] feat: Add mobile version of results page

---
 html/styles/main.css           | 25 +++++++++++++++++++++++++
 view/fragments/mobList.php     |  8 ++++----
 view/fragments/mobListItem.php | 10 +++++-----
 3 files changed, 34 insertions(+), 9 deletions(-)

diff --git a/html/styles/main.css b/html/styles/main.css
index 14ee2d1..58fe03c 100644
--- a/html/styles/main.css
+++ b/html/styles/main.css
@@ -244,8 +244,15 @@ h2 {
     margin-left: 2.5vw;
 }
 
+.right {
+    text-align: right;
+    padding-right: 15px;
+}
+
 .results-list img {
     height: 100px;
+    object-fit: contain;
+    width: 100px;
 }
 
 .results-list .trend-container {
@@ -423,4 +430,22 @@ h2 {
         width: auto;
         height: 7vh;
     }
+
+    .results-list td img {
+        width: 50px;
+        height: 50px;
+    }
+
+    .results-list .hide-on-mobile {
+        display: none;
+    }
+
+    .results-list .trend-container {
+        width: 190px;
+    }
+
+    #disclaimer {
+        max-width: 90vw;
+        margin: auto;
+    }
 }
diff --git a/view/fragments/mobList.php b/view/fragments/mobList.php
index a258524..5136b25 100644
--- a/view/fragments/mobList.php
+++ b/view/fragments/mobList.php
@@ -39,16 +39,16 @@ function makeSortButton(string $field): void {
             <th>
                 Name <?php makeSortButton("name"); ?>
             </th>
-            <th>
+            <th class="hide-on-mobile">
                 Rating <?php makeSortButton("rating"); ?>
             </th>
-            <th>
+            <th class="hide-on-mobile">
                 Matches <?php makeSortButton("matches"); ?>
             </th>
-            <th>
+            <th class="hide-on-mobile">
                 Wins <?php makeSortButton("wins"); ?>
             </th>
-            <th>
+            <th class="hide-on-mobile">
                 Losses <?php makeSortButton("losses"); ?>
             </th>
             <th>
diff --git a/view/fragments/mobListItem.php b/view/fragments/mobListItem.php
index 26771d0..e546400 100644
--- a/view/fragments/mobListItem.php
+++ b/view/fragments/mobListItem.php
@@ -6,7 +6,7 @@
     $uniqueSuffix = intval(microtime(true) * 1000) % 1000000;
 ?>
 <tr>
-    <td>
+    <td class="right">
         <?= $mob["position"] ?>
     </td>
     <td>
@@ -17,16 +17,16 @@
             <?= $mob["name"] ?>
         </a>
     </td>
-    <td>
+    <td class="hide-on-mobile right">
         <?= number_format($mob["rating"]) ?>
     </td>
-    <td>
+    <td class="hide-on-mobile right">
         <?= $mob["matches"] ?>
     </td>
-    <td>
+    <td class="hide-on-mobile right">
         <?= $mob["wins"] ?>
     </td>
-    <td>
+    <td class="hide-on-mobile right">
         <?= $mob["losses"] ?>
     </td>
     <td>