From 370577411bab9d57007a747a9eb4c049742cdc39 Mon Sep 17 00:00:00 2001
From: kelin <kelinfoxy@gmail.com>
Date: Sat, 9 May 2026 17:11:07 -0400
Subject: [PATCH] Update index.html

---
 index.html | 196 +++++++++++++++++++++++++++++------------------------
 1 file changed, 108 insertions(+), 88 deletions(-)
diff --git a/index.html b/index.html
index 01c9d5b..21551d2 100644
--- a/index.html
+++ b/index.html
@@ -6,8 +6,9 @@
     <title>Homelab Home</title>
     <style>
     :root {
-      --bg: #0b1017;
-      --panel: #131b25;
+      --bg:  #20334e;
+      --panel: radial-gradient(1200px 500px at 10% -10%, #26292e 0%, transparent 50%),
+        radial-gradient(900px 500px at 95% -20%, #010231 0%, transparent 55%), #20334e;
       --text: #e8eef7;
       --muted: #9fb0c3;
       --line: #233142;
@@ -26,8 +27,8 @@
       font-family: "Segoe UI", "Noto Sans", system-ui, sans-serif;
       color: var(--text);
       background:
-        radial-gradient(1200px 500px at 10% -10%, #1b3049 0%, transparent 60%),
-        radial-gradient(900px 500px at 95% -20%, #1a2839 0%, transparent 55%),
+        radial-gradient(1200px 500px at 10% -10%, #26292e 0%, transparent 60%),
+        radial-gradient(900px 500px at 95% -20%, #010231 0%, transparent 95%),
         var(--bg);
       min-height: 100vh;
       padding: 24px;
@@ -209,7 +210,7 @@
       display: block;
       top: 0px;
       padding: 0px 0px;
-      font-size: 3.5rem;
+      font-size: 3rem;
       letter-spacing: 0.2px;
       font-weight: 300;
       height: 100px;
@@ -229,7 +230,7 @@
       display: inline-block;
       vertical-align: middle;
       margin: 20px 0px;
-      font-size: 1.2rem;
+      font-size: 1.1rem;
       padding: 8px 16px;
       background: var(--accent);
       border-radius: 8px;
@@ -294,10 +295,12 @@
       display: inline-flex;
       font-size: 3rem;
       justify-content: center;
+      
     }
     .admin-row img {
       width: 30px;
       height: 30px;
+      box-shadow: var(--shadow);
     }
     .local-url {
       font-size: 0.8rem !important;
@@ -340,16 +343,29 @@
     .service-grid {
       display: grid;
       grid-template-columns: repeat(var(--num-columns-services), 1fr);
-      gap: 20px;
-      margin: 20px;
-      max-width: fit-content;
+      gap: 15px;
+      max-width: auto;
+      padding: 0px;
+      margin: 20px 10px;
+      justify-content: space-evenly;
     }
     .service-grid div a img {
       display: block;
-      gap: 6px;
+      gap: 2px;
       width: 50px;
       height: 50px;
     }
+    .service-grid div {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      border-radius: 10px;
+      border: 2px solid #143365;
+      padding: 5px 10px;
+      box-shadow: var(--shadow);
+      background: radial-gradient(1200px 500px at 10% -10%, #143365 0%, transparent 60%),
+        radial-gradient(900px 500px at 25% 5%, #323667 0%, transparent 10%), #091321;
+    }
   </style>
   </head>
   <body>
@@ -357,7 +373,7 @@
     <div class="header">
       <div class="header-flex">
         <img src="https://icons.kelinreij.duckdns.org/Kelin" class="fav-icon">
-        <div>Kelin's Homelab</div>
+        <div>KelinReij.duckdns.org</div>
         <div class="header-button-row">
           <div class="header-button"><a href="https://dashy.kelinreij.duckdns.org">Dashy</a></div>
           <div class="header-button"><a href="https://ha.kelinreij.duckdns.org">Home Assistant</a></div>
@@ -375,95 +391,99 @@
         <div class="group-column">
 
           <!--  FoxBox -->
-          <div class="admin-tile" style="border-color: rgba(185, 8, 8, 0.955);">
-            <img src="https://icons.kelinreij.duckdns.org/Kelin" class="admin-icon">
-            <div>
-              <div class="admin-title">FoxBox</div>
-              <div class="admin-row">
-                <div>
-                  <a href="https://arcane.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/arcane.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.29:3552" target="_blank" rel="noopener">3552</a>
-                </div>
-                <div>
-                  <a href="https://backrest.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/backrest-light.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.29:9898" target="_blank" rel="noopener">9898</a>
-                </div>
-                <div>
-                  <a href="https://dozzle.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/dozzle.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.29:8085" target="_blank" rel="noopener">8085</a>
-                </div>
-                <div>
-                  <a href="https://traefik.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/traefik.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.29:8080" target="_blank" rel="noopener">8080</a>
+          <div class="card table-wrap">
+            <div class="admin-tile" style="border-color: rgba(123, 117, 117, 0.955);">
+              <img src="https://icons.kelinreij.duckdns.org/Kelin" class="admin-icon">
+              <div>
+                <div class="admin-title">FoxBox</div>
+                <div class="admin-row">
+                  <div>
+                    <a href="https://arcane.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/arcane.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.29:3552" target="_blank" rel="noopener">3552</a>
+                  </div>
+                  <div>
+                    <a href="https://backrest.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/backrest-light.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.29:9898" target="_blank" rel="noopener">9898</a>
+                  </div>
+                  <div>
+                    <a href="https://dozzle.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/dozzle.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.29:8085" target="_blank" rel="noopener">8085</a>
+                  </div>
+                  <div>
+                    <a href="https://traefik.foxbox.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/traefik.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.29:8080" target="_blank" rel="noopener">8080</a>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-
           <!--  Tucker -->
-          <div class="admin-tile" style="border-color: rgba(185, 8, 8, 0.955);">
-            <img src="https://icons.kelinreij.duckdns.org/Tucker.svg" class="admin-icon">
-            <div>
-              <div class="admin-title">Tucker</div>
-              <div class="admin-row">
-                <div>
-                  <a href="https://arcane.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/arcane.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.10:3552" target="_blank" rel="noopener">3552</a>
-                </div>
-                <div>
-                  <a href="https://backrest.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/backrest-light.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.10:9898" target="_blank" rel="noopener">9898</a>
-                </div>
-                <div>
-                  <a href="https://dozzle.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/dozzle.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.10:8085" target="_blank" rel="noopener">8085</a>
-                </div>
-                <div>
-                  <a href="https://traefik.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/traefik.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.10:8080" target="_blank" rel="noopener">8080</a>
+          <div class="card table-wrap">  
+            <div class="admin-tile" style="border-color: rgba(123, 117, 117, 0.955);">
+              <img src="https://icons.kelinreij.duckdns.org/Tucker.svg" class="admin-icon">
+              <div>
+                <div class="admin-title">Tucker</div>
+                <div class="admin-row">
+                  <div>
+                    <a href="https://arcane.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/arcane.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.10:3552" target="_blank" rel="noopener">3552</a>
+                  </div>
+                  <div>
+                    <a href="https://backrest.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/backrest-light.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.10:9898" target="_blank" rel="noopener">9898</a>
+                  </div>
+                  <div>
+                    <a href="https://dozzle.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/dozzle.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.10:8085" target="_blank" rel="noopener">8085</a>
+                  </div>
+                  <div>
+                    <a href="https://traefik.tucker.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/traefik.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.10:8080" target="_blank" rel="noopener">8080</a>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
     
           <!--  Pokee -->
-          <div class="admin-tile" style="border-color: rgba(185, 8, 8, 0.955);">
-            <img src="https://icons.kelinreij.duckdns.org/Pokee.svg" class="admin-icon">
-            <div>
-              <div class="admin-title">Pokee</div>
-              <div class="admin-row">
-                <div>
-                  <a href="https://arcane.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/arcane.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.13:3552" target="_blank" rel="noopener">3552</a>
-                </div>
-                <div>
-                  <a href="https://backrest.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/backrest-light.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.13:9898" target="_blank" rel="noopener">9898</a>
-                </div>
-                <div>
-                  <a href="https://dozzle.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/dozzle.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.13:8085" target="_blank" rel="noopener">8085</a>
-                </div>
-                <div>
-                  <a href="https://traefik.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
-                  <img src="https://icons.kelinreij.duckdns.org/traefik.svg"></a><br>
-                  <a class="local-url" href="http://192.168.4.13:8080" target="_blank" rel="noopener">8080</a>
+          <div class="card table-wrap">
+            <div class="admin-tile" style="border-color: rgba(123, 117, 117, 0.955);">
+              <img src="https://icons.kelinreij.duckdns.org/Pokee.svg" class="admin-icon">
+              <div>
+                <div class="admin-title">Pokee</div>
+                <div class="admin-row">
+                  <div>
+                    <a href="https://arcane.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/arcane.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.13:3552" target="_blank" rel="noopener">3552</a>
+                  </div>
+                  <div>
+                    <a href="https://backrest.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/backrest-light.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.13:9898" target="_blank" rel="noopener">9898</a>
+                  </div>
+                  <div>
+                    <a href="https://dozzle.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/dozzle.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.13:8085" target="_blank" rel="noopener">8085</a>
+                  </div>
+                  <div>
+                    <a href="https://traefik.pokee.kelinreij.duckdns.org" target="_blank" rel="noopener">
+                    <img src="https://icons.kelinreij.duckdns.org/traefik.svg"></a><br>
+                    <a class="local-url" href="http://192.168.4.13:8080" target="_blank" rel="noopener">8080</a>
+                  </div>
                 </div>
               </div>
-            </div>
-          </div> 
-
+            </div> 
+          </div>
         </div>
 
         <!--  Second Column -->
@@ -738,4 +758,4 @@
     </div>  <!--  End wrap -->
 
   </body>
-</html>
+</html>
\ No newline at end of file
