From 375d2131eb5f0b07b17f834f5e6a57cc9d66363c Mon Sep 17 00:00:00 2001
From: Krzak <admin@krzak.org>
Date: Sun, 18 Jan 2026 02:45:20 +0100
Subject: [PATCH] Add shimmer effect to support button

---
 index.html |  2 +-
 styles.css | 63 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 64 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 56b65b2..78f2682 100755
--- a/index.html
+++ b/index.html
@@ -121,7 +121,7 @@
                     </a>
                 </li>
                 <li class="slide-up" style="animation-delay: 0.4s">
-                    <a href="https://liberapay.com/krzak">
+                    <a href="https://liberapay.com/krzak" class="support-link">
                         <strong>Support</strong>
                         <span>Liberapay</span>
                     </a>
diff --git a/styles.css b/styles.css
index 67643f8..efc6f9b 100644
--- a/styles.css
+++ b/styles.css
@@ -559,3 +559,66 @@ li a span {
 
     border-color: transparent !important;
 }
+
+/* Support Button - Shimmer Effect Style */
+.support-link {
+    background: linear-gradient(
+        135deg,
+        var(--accent-color) 0%,
+        #ff8c42 100%
+    ) !important;
+    border: 2px solid rgba(255, 255, 255, 0.4) !important;
+    position: relative;
+    overflow: hidden;
+}
+
+.support-link::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(
+        90deg,
+        transparent,
+        rgba(255, 255, 255, 0.4),
+        transparent
+    );
+    animation: shimmer 2.5s infinite;
+    z-index: 0;
+}
+
+.support-link::after {
+    display: none !important; /* Remove the standard shine effect */
+}
+
+@keyframes shimmer {
+    0% {
+        left: -100%;
+    }
+    100% {
+        left: 200%;
+    }
+}
+
+.support-link:hover {
+    transform: translateY(-3px) scale(1.01) !important;
+    box-shadow: 0 10px 40px rgba(244, 162, 97, 0.6) !important;
+    border-color: rgba(255, 255, 255, 0.6) !important;
+}
+
+.support-link strong,
+.support-link span {
+    color: #1a103c !important;
+    position: relative;
+    z-index: 1;
+}
+
+.support-link strong {
+    font-weight: 700 !important;
+}
+
+.support-link span {
+    opacity: 0.85 !important;
+}