jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-03 17:26:37 -04:00
Code Issues Activity

add :focus-visible css selector to some hover styles

Browse Source
This commit is contained in:
Jake Jarvis
2022-07-27 18:05:50 -04:00
parent 78593b03ca
commit 1f373541be
12 changed files with 27 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
pages/index.tsx
View File

@ -103,13 +103,6 @@ const Quiet = styled("span", {
color: theme.colors.mediumLight,
});
const EasterEgg = styled(ColorfulLink, {
// rotated 🪄 emoji on hover
"&:hover": {
cursor: `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='30' style='font-size:24px'><text y='50%' transform='rotate(-70 0 0) translate(-20, 6)'>🪄</text></svg>") 5 5, auto`,
},
});
const Index = () => {
return (
<>
@ -225,14 +218,20 @@ const Index = () => {
backend programming
</ColorfulLink>{" "}
back when my only source of income was{" "}
<EasterEgg
<ColorfulLink
href="/birthday/"
title="🎉 Cranky Birthday Boy on VHS Tape 📼"
lightColor="#e40088"
darkColor="#fd40b1"
css={{
// rotated 🪄 emoji on hover
"&:hover": {
cursor: `url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='30' style='font-size:24px'><text y='50%' transform='rotate(-70 0 0) translate(-20, 6)'>🪄</text></svg>") 5 5, auto`,
},
}}
>
the Tooth Fairy
</EasterEgg>
</ColorfulLink>
. <Quiet>I've improved a bit since then, I think? 🤷</Quiet>
</Paragraph>