Changed footer buttons to feel more responsive

This commit is contained in:
Patrick Schwarzer 2025-05-12 01:48:20 +02:00
parent b24c8555a2
commit 95e7f8f333

View file

@ -127,7 +127,7 @@ footer .links {
margin-bottom: 24px; margin-bottom: 24px;
} }
footer a { footer a {
display: flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -136,7 +136,7 @@ footer a {
background-color: rgb(39, 44, 48); background-color: rgb(39, 44, 48);
color: white; color: white;
font-size: 24px; font-size: 20px;
border: none; border: none;
border-radius: 50%; border-radius: 50%;
text-decoration: none; text-decoration: none;
@ -147,9 +147,13 @@ footer a:hover {
body.light-mode footer a { body.light-mode footer a {
background-color: rgb(231, 231, 231); background-color: rgb(231, 231, 231);
color: rgb(29, 29, 29); color: rgb(29, 29, 29);
transition: color 0s;
transition: transform 0.15s ease;
} }
body.light-mode footer a:hover { body.light-mode footer a:hover {
background-color: rgb(192, 192, 192); color: white;
background-color: #5865f2;
transform: translateY(-3px);
} }
footer p { footer p {
@ -168,7 +172,7 @@ body.light-mode footer p {
main { main {
max-width: 1200px; max-width: 1200px;
padding-top: 32px; padding-top: 32px;
margin: 72px auto 0 auto; /* Top margin matches header height */ margin: 72px auto 0 auto;
} }