Skip to content

Commit 1419df7

Browse files
committed
feat: enhance footer UI and responsiveness
1 parent 8d17610 commit 1419df7

1 file changed

Lines changed: 5 additions & 5 deletions

File tree

src/components/Footer.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ function Footer() {
1818
bg-white
1919
/* Dark Mode: Retained matching deep navy navbar theme background */
2020
dark:bg-[#0f172a]
21-
font-sans select-none"
21+
font-sans select-none before:absolute before:inset-0 before:bg-gradient-to-b before:from-blue-500/5 before:to-transparent before:pointer-events-none"
2222
>
2323
<div className="max-w-7xl mx-auto px-8 pt-16 pb-10 relative z-10">
2424

@@ -102,7 +102,7 @@ function Footer() {
102102
/>
103103
<button
104104
type="submit"
105-
className="px-5 py-3 text-sm font-bold bg-blue-600 hover:bg-blue-700 text-white rounded-xl shadow-sm active:scale-[0.98] transition-all flex items-center justify-center space-x-1.5 whitespace-nowrap"
105+
className="px-5 py-3 text-sm font-bold bg-blue-600 hover:bg-blue-700 text-white rounded-xl shadow-sm active:scale-[0.98] transition-all duration-300 hover:shadow-lg hover:shadow-blue-500/20 flex items-center justify-center space-x-1.5 whitespace-nowrap"
106106
>
107107
<span>Subscribe</span>
108108
<FaArrowRight className="h-3.5 w-3.5" />
@@ -133,7 +133,7 @@ function Footer() {
133133
href="https://github.com/GitMetricsLab/github_tracker"
134134
target="_blank"
135135
rel="noopener noreferrer"
136-
className="text-zinc-400 dark:text-zinc-500 hover:text-zinc-900 dark:hover:text-zinc-100 transition-colors duration-200"
136+
className="text-zinc-400 dark:text-zinc-500 hover:text-zinc-900 dark:hover:text-zinc-100 transition-all duration-300 hover:-translate-y-1 hover:scale-110"
137137
aria-label="GitHub Repository"
138138
>
139139
<FaGithub className="h-7 w-7" />
@@ -142,7 +142,7 @@ function Footer() {
142142
href="https://x.com/your_handle"
143143
target="_blank"
144144
rel="noopener noreferrer"
145-
className="text-zinc-400 dark:text-zinc-500 hover:text-sky-500 dark:hover:text-zinc-100 transition-colors duration-200"
145+
className="text-zinc-400 dark:text-zinc-500 hover:text-sky-500 dark:hover:text-zinc-100 transition-all duration-300 hover:-translate-y-1 hover:scale-110"
146146
aria-label="Twitter"
147147
>
148148
<FaTwitter className="h-7 w-7" />
@@ -151,7 +151,7 @@ function Footer() {
151151
href="https://discord.gg/your_invite"
152152
target="_blank"
153153
rel="noopener noreferrer"
154-
className="text-zinc-400 dark:text-zinc-500 hover:text-indigo-500 dark:hover:text-zinc-100 transition-colors duration-200"
154+
className="text-zinc-400 dark:text-zinc-500 hover:text-indigo-500 dark:hover:text-zinc-100 transition-all duration-300 hover:-translate-y-1 hover:scale-110"
155155
aria-label="Discord"
156156
>
157157
<FaDiscord className="h-7 w-7" />

0 commit comments

Comments
 (0)