From 3c19ba3a31ffd33d85cf91f1585912d48d90ab6e Mon Sep 17 00:00:00 2001
From: pancakes <p@pancakes.gay>
Date: Tue, 23 Sep 2025 13:28:39 +1000
Subject: [PATCH] Fix alignment of buttons

---
 PancakesWeb/Components/Pages/Home.razor         | 16 ++++++----------
 PancakesWeb/Components/Pages/Home.razor.css     |  4 ----
 PancakesWeb/Components/UI/ImageButton.razor.css |  5 +++++
 3 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/PancakesWeb/Components/Pages/Home.razor b/PancakesWeb/Components/Pages/Home.razor
index afe13e0..90514fd 100644
--- a/PancakesWeb/Components/Pages/Home.razor
+++ b/PancakesWeb/Components/Pages/Home.razor
@@ -108,23 +108,19 @@
             manually.</p>
     </details>
 
-    <ul class="buttons card">
+    <div class="buttons card">
         @foreach (var button in Buttons.Entities.OrderBy(p => p.Title))
         {
-            <li class="button">
-                <ImageButton Data="button"/>
-            </li>
+            <ImageButton Data="button"/>
         }
-    </ul>
+    </div>
 
-    <ul class="buttons card">
+    <div class="buttons card">
         @foreach (var button in Buttons.Things.OrderBy(p => p.Title))
         {
-            <li class="button">
-                <ImageButton Data="button"/>
-            </li>
+            <ImageButton Data="button"/>
         }
-    </ul>
+    </div>
 
     <h2 id="webrings">Webrings</h2>
     <p>Adjacent websites</p>
diff --git a/PancakesWeb/Components/Pages/Home.razor.css b/PancakesWeb/Components/Pages/Home.razor.css
index 550b455..e287b93 100644
--- a/PancakesWeb/Components/Pages/Home.razor.css
+++ b/PancakesWeb/Components/Pages/Home.razor.css
@@ -58,10 +58,6 @@
     list-style: none;
 }
 
-.button {
-    display: inline-flex;
-}
-
 @media screen and (max-width: 768px) {
     .accounts {
         flex-direction: column;
diff --git a/PancakesWeb/Components/UI/ImageButton.razor.css b/PancakesWeb/Components/UI/ImageButton.razor.css
index fd225ba..07e4267 100644
--- a/PancakesWeb/Components/UI/ImageButton.razor.css
+++ b/PancakesWeb/Components/UI/ImageButton.razor.css
@@ -1,5 +1,10 @@
 .button-link {
+    display: inline-block;
+    height: 31px;
+
     text-decoration: none;
+    line-height: 1;
+    text-align: center;
 }
 
 .button-link::after {