feat(footer): add social icons, centered layout, surface background

Replace inline-styled footer with structured layout using Feather Icons
(GitHub, Twitter, LinkedIn). Fix background by targeting #footer-custom
directly — cgit injects footer content without a div.footer wrapper.

3 files changed, 59 insertions, 11 deletions

diff --git a/cgit.css b/cgit.css
index 9114f17..dc4389b 100644
--- a/cgit.css
+++ b/cgit.css
@@ -1082,26 +1082,61 @@ td.lines pre code {
    ============================================================= */
 
 div.footer {
-  border-top: 1px solid var(--border);
-  background: rgba(var(--bg2-rgb), 0.6);
-  padding: 20px 32px;
+  /* cgit may or may not emit this wrapper depending on version */
+  padding: 0;
   margin-top: auto;
+}
+
+#footer-custom {
+  border-top: 1px solid var(--border);
+  background: var(--surface);
+  box-shadow: 0 -4px 24px rgba(var(--accent-rgb), 0.10);
+  padding: 24px 32px;
   font-family: 'IBM Plex Sans', sans-serif;
   font-size: 14px;
   color: var(--muted);
   display: flex;
+  flex-direction: column;
   align-items: center;
-  justify-content: space-between;
-  flex-wrap: wrap;
-  gap: 8px;
+  gap: 10px;
+  width: 100%;
+  text-align: center;
+}
+
+.footer-social {
+  display: flex;
+  gap: 20px;
+  align-items: center;
+}
+
+.footer-social-link {
+  color: var(--text-dim);
+  display: flex;
+  align-items: center;
+  transition: color 0.15s;
+}
+
+.footer-social-link:hover {
+  color: var(--accent);
+  opacity: 1;
+}
+
+.footer-copy,
+.footer-powered {
+  color: var(--muted);
+}
+
+.footer-copy a.footer-home {
+  color: var(--accent2);
+  font-weight: 600;
 }
 
-div.footer a {
+.footer-powered a {
   color: var(--text-dim);
   text-decoration: none;
 }
 
-div.footer a:hover {
+.footer-powered a:hover {
   color: var(--accent);
   opacity: 1;
 }
diff --git a/footer.html b/footer.html
index fd92532..06271b9 100644
--- a/footer.html
+++ b/footer.html
@@ -1,4 +1,16 @@
-<div id="footer-custom" style="display:flex;align-items:center;justify-content:space-between;width:100%;flex-wrap:wrap;gap:8px;">
-  <span>© 2026 <a href="https://danix.xyz" style="color:#00ff88;font-weight:600;">danix.xyz</a></span>
-  <span>powered by <a href="https://git.zx2c4.com/cgit/">cgit</a></span>
+<div id="footer-custom">
+  <div class="footer-social">
+    <a href="https://github.com/danixland" class="footer-social-link" aria-label="GitHub" target="_blank" rel="noopener">
+      <i data-feather="github"></i>
+    </a>
+    <a href="https://x.com/danixland" class="footer-social-link" aria-label="Twitter/X" target="_blank" rel="noopener">
+      <i data-feather="twitter"></i>
+    </a>
+    <a href="https://www.linkedin.com/in/danilo-macri-aka-danix/" class="footer-social-link" aria-label="LinkedIn" target="_blank" rel="noopener">
+      <i data-feather="linkedin"></i>
+    </a>
+  </div>
+  <div class="footer-copy">© 2026 <a href="https://danix.xyz" class="footer-home">danix.xyz</a></div>
+  <div class="footer-powered">powered by <a href="https://git.zx2c4.com/cgit/">cgit</a></div>
 </div>
+<script>feather.replace({ width: 18, height: 18 });</script>
diff --git a/head.html b/head.html
index a6e0c46..874587b 100644
--- a/head.html
+++ b/head.html
@@ -2,3 +2,4 @@
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Oxanium:wght@400;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>