wah.su/wah-su.github.io
1
0
Fork 0
mirror of https://github.com/wah-su/wah-su.github.io.git synced 2025-04-05 15:54:40 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

add footer link colors transition on hover

Browse source
This commit is contained in:
Kentai Radiquum 2025-02-13 02:02:25 +05:00
parent 6a41d4354b
commit 08bdb930ac
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
2 changed files with 29 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/static/css/tailwind.css
View file

@ -956,6 +956,13 @@
} }
} }
} }
.hover\:text-\[\#FF851A\] {
&:hover {
@media (hover: hover) {
color: #FF851A;
}
}
}
.sm\:flex-shrink-1 { .sm\:flex-shrink-1 {
@media (width >= 40rem) { @media (width >= 40rem) {
flex-shrink: 1; flex-shrink: 1;

27
src/templates/Footer.tsx
View file

@ -10,7 +10,7 @@ export default function Footer({ className }: FooterProps) {
<div className="flex items-start flex-col gap-4"> <div className="flex items-start flex-col gap-4">
<a <a
href="https://status.wah.su" href="https://status.wah.su"
className="flex flex-row items-center justify-center gap-3" className="flex flex-row items-center justify-center gap-3 hover:text-[#FF851A] transition-colors"
target="_blank" target="_blank"
> >
<div <div
@ -35,12 +35,26 @@ export default function Footer({ className }: FooterProps) {
/> />
</div> </div>
<span>Photo by</span>{" "} <span>Photo by</span>{" "}
<a href="https://unsplash.com/@lgtts">Ilse Orsel</a> <span>on</span>{" "} <a
<a href="https://unsplash.com">Unsplash</a> href="https://unsplash.com/@lgtts"
className="hover:text-[#FF851A] transition-colors"
>
Ilse Orsel
</a>{" "}
<span>on</span>{" "}
<a
href="https://unsplash.com"
className="hover:text-[#FF851A] transition-colors"
>
Unsplash
</a>
</div> </div>
</div> </div>
<div className="flex gap-8"> <div className="flex gap-8">
<a href="https://wah.su/radiquum" className="flex gap-2"> <a
href="https://wah.su/radiquum"
className="flex gap-2 hover:text-[#FF851A] transition-colors"
>
<div className="h-6 w-6 bg-white rounded-full overflow-hidden"> <div className="h-6 w-6 bg-white rounded-full overflow-hidden">
<img <img
src="/static/images/avatar_48.jpg" src="/static/images/avatar_48.jpg"
@ -50,7 +64,10 @@ export default function Footer({ className }: FooterProps) {
</div> </div>
<p>Run by @Radiquum</p> <p>Run by @Radiquum</p>
</a> </a>
<a href="https://github.com/wah-su" className="flex gap-2"> <a
href="https://github.com/wah-su"
className="flex gap-2 hover:text-[#FF851A] transition-colors"
>
<div className="h-6 w-6 bg-white rounded-full"> <div className="h-6 w-6 bg-white rounded-full">
<img <img
src="/static/images/GitHub_Invertocat_Dark.png" src="/static/images/GitHub_Invertocat_Dark.png"