From 30819a8e141643618c0061233a7e94966a17af99 Mon Sep 17 00:00:00 2001
From: Rico van Zelst <ricovzelst@pm.me>
Date: Sat, 24 Feb 2024 21:54:32 +0100
Subject: [PATCH] style(about): Rearrange classes in about page for consistency

- Reordered classes in HTML elements for better readability and maintainability.
- Updated class order in various elements to follow a consistent pattern.
---
 resources/views/about/index.blade.php       | 32 ++++++++++-----------
 resources/views/components/footer.blade.php | 14 ++++-----
 2 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/resources/views/about/index.blade.php b/resources/views/about/index.blade.php
index 883a497..6f1cc59 100644
--- a/resources/views/about/index.blade.php
+++ b/resources/views/about/index.blade.php
@@ -5,32 +5,30 @@
 frequently asked questions about League of Legends, Heimerdinger and us. Dive in now!')
 
 @section('content')
-    <div class="max-w-screen-xl mx-auto px-5 min-h-sceen">
+    <div class="max-w-screen-xl px-5 mx-auto min-h-sceen">
         <div class="flex flex-col items-center">
             <h1
-                class="mt-7 text-3xl font-bold text-center text-transparent uppercase sm:text-4xl
-        bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text">
+                class="text-3xl font-bold text-center text-transparent uppercase mt-7 sm:text-4xl bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text">
                 About</h1>
             <h2
-                class="text-lg font-bold text-center text-transparent uppercase
-        bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text ">
+                class="text-lg font-bold text-center text-transparent uppercase bg-gradient-to-bl from-orange-300 to-orange-500 bg-clip-text ">
                 Learn all about League of Legends, Heimerdinger and us.</h2>
         </div>
 
-        <div class="flex justify-center items-center mt-2">
+        <div class="flex items-center justify-center mt-2">
             <a href="{{route('about.faq.heimerdinger')}}"
-               class="bg-orange-500 text-white font-bold py-2 px-4 rounded hover:bg-orange-600 mr-3">FAQ •
+               class="px-4 py-2 mr-3 font-bold text-white bg-orange-500 rounded hover:bg-orange-600">FAQ •
                 Heimerdinger</a>
             <a href="{{route('about.faq.leagueoflegends')}}"
-               class="bg-orange-500 text-white font-bold py-2 px-4 rounded hover:bg-orange-600">FAQ • League of
+               class="px-4 py-2 font-bold text-white bg-orange-500 rounded hover:bg-orange-600">FAQ • League of
                 Legends</a>
         </div>
 
-        <div class="flex flex-col items-center mt-5 justify-center ">
+        <div class="flex flex-col items-center justify-center mt-5 ">
             <h2
-                class="text-lg font-bold text-center uppercase text-gray-100">
+                class="text-lg font-bold text-center text-gray-100 uppercase">
                 What is League of Legends?</h2>
-            <p class="text-center text-stone-300 mt-2 max-w-3xl">
+            <p class="max-w-3xl mt-2 text-center text-stone-300">
                 League of Legends (LoL), commonly referred to as League, is a MOBA game developed and published by Riot
                 Games. The game was inspired by DoTA, a custom map for
                 Warcraft III, and was released in October 2009. Since its release, League has been free-to-play and is
@@ -70,9 +68,9 @@ frequently asked questions about League of Legends, Heimerdinger and us. Dive in
         <hr class="w-48 h-1 mx-auto my-4 border-0 rounded md:my-10 bg-stone-500">
         <div class="flex flex-col items-center mt-5">
             <h2
-                class="text-lg font-bold text-center uppercase text-gray-100">
+                class="text-lg font-bold text-center text-gray-100 uppercase">
                 What is Heimerdinger.lol?</h2>
-            <p class="text-center text-stone-300 mt-2 max-w-3xl">
+            <p class="max-w-3xl mt-2 text-center text-stone-300">
                 Heimerdinger.lol is a website dedicated to providing information about League of Legends and its events.
                 We provide in-depth information about the champions, skins, game assets, and more.
                 <br><br>
@@ -91,17 +89,17 @@ frequently asked questions about League of Legends, Heimerdinger and us. Dive in
                 <br><br>
                 I am always looking for ways to improve this website. If you have any suggestions, feedback, or just
                 want to
-                say hi, you can do so by contacting me through the contact form on my <a
-                    href="https://rico.sh/contact/" class="underline decoration-orange-500/50" target="_blank">personal
+                say hi, you can do so by contacting me through the contact form on <a
+                    href="/contact" class="underline decoration-orange-500/50" target="_blank">this
                     website</a>. I will try to respond as soon as possible.
             </p>
         </div>
         <hr class="w-48 h-1 mx-auto my-4 border-0 rounded md:my-10 bg-stone-500">
         <div class="flex flex-col items-center mt-5">
             <h2
-                class="text-lg font-bold text-center uppercase text-gray-100">
+                class="text-lg font-bold text-center text-gray-100 uppercase">
                 Who is Heimerdinger?</h2>
-            <p class="text-center text-stone-300 mt-2 max-w-3xl">
+            <p class="max-w-3xl mt-2 text-center text-stone-300">
                 Heimerdinger is a character from the game. He is a brilliant
                 scientist, Professor Cecil B. Heimerdinger, which is his full name, is one of the most innovative and
                 esteemed inventors
diff --git a/resources/views/components/footer.blade.php b/resources/views/components/footer.blade.php
index 0e7e5dd..82fbf7e 100644
--- a/resources/views/components/footer.blade.php
+++ b/resources/views/components/footer.blade.php
@@ -1,13 +1,13 @@
 <footer class="p-4 mt-7 md:p-8 lg:p-10 bg-stone-800 shadow-footer">
-    <div class="mx-auto max-w-screen-xl text-center">
-        <a href="/" class="flex justify-center items-center text-2xl font-semibold text-gray-100">
+    <div class="max-w-screen-xl mx-auto text-center">
+        <a href="/" class="flex items-center justify-center text-2xl font-semibold text-gray-100">
             <x-logo class="w-auto mr-2 h-9" alt="Heimerdinger.lol Logo"/>
             Heimerdinger.LoL
         </a>
         <p class="my-4 text-sm text-gray-500 dark:text-gray-400">Heimerdinger.LoL was created under <a
                 href="https://www.riotgames.com/" target="_blank">Riot Games</a>' "<a
                 href="https://www.riotgames.com/en/legal"
-                class="underline decoration-orange-500/50 hover:decoration-orange-500 transition-all duration-700 hover:decoration-1"
+                class="underline transition-all duration-700 decoration-orange-500/50 hover:decoration-orange-500 hover:decoration-1"
                 target="_blank">Legal
                 Jibber
                 Jabber</a>" policy
@@ -15,9 +15,9 @@
                 href="https://www.riotgames.com/" target="_blank">Riot Games</a>. <a
                 href="https://www.riotgames.com/" target="_blank">Riot Games</a> does not endorse or sponsor
             this project.</p>
-        <ul class="flex flex-wrap justify-center items-center mb-6 text-neutral-300 ">
+        <ul class="flex flex-wrap items-center justify-center mb-6 text-neutral-300 ">
             <li>
-                <a href="#"
+                <a href="/contact"
                    class="mr-4 hover:underline md:mr-6 decoration-orange-500 decoration-1">Contact</a>
             </li>
             <li>
@@ -31,8 +31,8 @@
 
         </ul>
         <span
-            class="text-sm text-gray-500 sm:text-center dark:text-gray-400 items-center flex flex-row justify-center whitespace-pre">© {{date('Y')}} <a
+            class="flex flex-row items-center justify-center text-sm text-gray-500 whitespace-pre sm:text-center dark:text-gray-400">© {{date('Y')}} <a
                 href="/" class=" hover:underline">Heimerdinger.LoL</a> • Made with <a href="https://rico.sh"><x-iconsax-bul-heart-circle
-                class="inline-block w-5 self-center relative text-red-400"/></a></span>
+                class="relative self-center inline-block w-5 text-red-400"/></a></span>
     </div>
 </footer>