From 8c124f64dd72c63a798f5841f689ceeb1ea5b764 Mon Sep 17 00:00:00 2001
From: futile <git@futile.eu>
Date: Wed, 11 Dec 2024 05:51:04 +0000
Subject: [PATCH] superior buttons layout

---
 index.html | 71 +++++++++++++++++++++---------------------------------
 1 file changed, 28 insertions(+), 43 deletions(-)

diff --git a/index.html b/index.html
index 259b03d..f527e41 100644
--- a/index.html
+++ b/index.html
@@ -138,7 +138,7 @@
             }
         }
 
-        ul.footer {
+        .footer {
             list-style-type: none;
             display: flex;
             justify-content: center;
@@ -146,11 +146,11 @@
             flex-wrap: wrap;
         }
 
-        ul.footer li {
+        .buttons {
             line-height: 0;
         }
 
-        ul.footer li a {
+        .buttons a {
             color: var(--primary-color);
         }
 
@@ -173,7 +173,7 @@
         div.footer.quote {
             text-align: center;
             word-wrap: break-word;
-            margin: -24px auto auto auto;
+            margin: -8px auto auto auto;
         }
 
         div.footer.links {
@@ -228,45 +228,30 @@ i would love to work with/for you! reach out to me via email [me@futile.eu] (eve
         </p>
     </div>
     <div class="footer-container">
-        <div class="footer">
-            <ul class="footer buttons">
-                <li><a href="https://futile.eu"><img src="static/buttons/futile.png" width="88px" height="31px"
-                            alt="button that says 'futile' in white, grotesque font, on a black background, with a white outline | by futile" /></a>
-                </li>
-                <li><a href="https://xenia.blahaj.land/"><img src="static/buttons/rose_88x31.png" width="88px"
-                            height="31px"
-                            alt="button that says 'rose' with a rose growing out of the 'o', with milk-chan to the right of the text | by rose" /></a>
-                </li>
-                <li><iframe src="https://increm.net/badge?key=futile" title="incremnet badge" width="88" height="31"
-                        frameborder="0" style="background: url('https://increm.net/bg.png')"></iframe></li>
-                <li><a href="https://fedoraproject.org/spins/kde"><img src="static/buttons/fedora.png" width="88px"
-                            height="31px"
-                            alt="button that says 'powered by fedora' in white and blue, with the fedora logo to the left | by unknown; retouched by futile" /></a>
-                </li>
-                <li><a href="https://mozilla.org/firefox"><img src="static/buttons/firefox4.gif" width="88px"
-                            height="31px"
-                            alt="button that flashes between the texts 'tested on' and 'firefox' in firefox's orange, yellow, and purple scheme, with the firefox logo to the left | by unknown" /></a>
-                </li>
-                <li><a href="https://vscodium.com"><img src="static/buttons/vscodium.com.png" width="88px" height="31px"
-                            alt="button that says 'made with vscodium' in light blue, with the vscodium logo to the right | by unknown" /></a>
-                </li>
-                <li><img src="static/buttons/FirtniteButton.png" onclick="alert('firt night')" width="88px"
-                        height="31px"
-                        alt="button that says 'firtnite' (a misspelling of 'fortnite'), otherwise looks very similar to an old fortnite title screen | by unknown" />
-                </li>
-                <li><a href="https://ublockorigin.com"><img src="static/buttons/ublock.png" width="88px" height="31px"
-                            alt="button (grey) that says 'ublock origin now!', with the ublock origin red logo to the left | by unknown" /></a>
-                </li>
-                <li><a href="https://rust-lang.org"><img src="static/buttons/rustNOW.png" width="88px" height="31px"
-                            alt="button (grey) that says 'rust now!', with the rust gear logo to the left and a yellow banner that says '1.82.0' on the to the bottom right | by futile" /></a>
-                </li>
-                <li><a href="https://1337x.to"><img src="static/buttons/piracy.png" width="88px" height="31px"
-                            alt="button (grey) that says 'piracy now!', with a jolly roger flag to the left and a black banner that says 'free' on the to the bottom right | by unknown; retouched by futile" /></a>
-                </li>
-                <li><a href="https://vostok.one"><img src="static/buttons/vostok.png" width="88px" height="31px"
-                            alt="button with a glowing white border that says 'vostok.one' with some small text below that that says '$ tread carefully', all in black and white | by futile" /></a>
-                </li>
-            </ul>
+        <div class="footer buttons">
+            <a href="https://futile.eu"><img src="static/buttons/futile.png" width="88px" height="31px"
+                    alt="button that says 'futile' in white, grotesque font, on a black background, with a white outline | by futile" /></a>
+            <a href="https://xenia.blahaj.land/"><img src="static/buttons/rose_88x31.png" width="88px" height="31px"
+                    alt="button that says 'rose' with a rose growing out of the 'o', with milk-chan to the right of the text | by rose" /></a>
+            <iframe src="https://increm.net/badge?key=futile" title="incremnet badge" width="88" height="31"
+                frameborder="0" style="background: url('https://increm.net/bg.png')"></iframe>
+            <a href="https://fedoraproject.org/spins/kde"><img src="static/buttons/fedora.png" width="88px"
+                    height="31px"
+                    alt="button that says 'powered by fedora' in white and blue, with the fedora logo to the left | by unknown; retouched by futile" /></a>
+            <a href="https://mozilla.org/firefox"><img src="static/buttons/firefox4.gif" width="88px" height="31px"
+                    alt="button that flashes between the texts 'tested on' and 'firefox' in firefox's orange, yellow, and purple scheme, with the firefox logo to the left | by unknown" /></a>
+            <a href="https://vscodium.com"><img src="static/buttons/vscodium.com.png" width="88px" height="31px"
+                    alt="button that says 'made with vscodium' in light blue, with the vscodium logo to the right | by unknown" /></a>
+            <img src="static/buttons/FirtniteButton.png" onclick="alert('firt night')" width="88px" height="31px"
+                alt="button that says 'firtnite' (a misspelling of 'fortnite'), otherwise looks very similar to an old fortnite title screen | by unknown" />
+            <a href="https://ublockorigin.com"><img src="static/buttons/ublock.png" width="88px" height="31px"
+                    alt="button (grey) that says 'ublock origin now!', with the ublock origin red logo to the left | by unknown" /></a>
+            <a href="https://rust-lang.org"><img src="static/buttons/rustNOW.png" width="88px" height="31px"
+                    alt="button (grey) that says 'rust now!', with the rust gear logo to the left and a yellow banner that says '1.82.0' on the to the bottom right | by futile" /></a>
+            <a href="https://1337x.to"><img src="static/buttons/piracy.png" width="88px" height="31px"
+                    alt="button (grey) that says 'piracy now!', with a jolly roger flag to the left and a black banner that says 'free' on the to the bottom right | by unknown; retouched by futile" /></a>
+            <a href="https://vostok.one"><img src="static/buttons/vostok.png" width="88px" height="31px"
+                    alt="button with a glowing white border that says 'vostok.one' with some small text below that that says '$ tread carefully', all in black and white | by futile" /></a>
         </div>
         <div class="footer quote">
             <p id="quote">&nbsp;</p>