From 8f0287b23e4169182c1c7e4eda612196f683babd Mon Sep 17 00:00:00 2001 From: beefchimi Date: Thu, 25 Jul 2024 18:38:27 -0400 Subject: [PATCH] :bento: [Assets] Replace PNG cursors with SVGs --- src/assets/img/README.md | 3 +++ src/assets/img/cursor-auto.png | Bin 394 -> 0 bytes src/assets/img/cursor-dead.png | Bin 784 -> 0 bytes src/assets/img/cursor-pointer-clicked.png | Bin 716 -> 0 bytes src/assets/img/cursor-pointer.png | Bin 509 -> 0 bytes src/assets/img/cursor-rock-clicked.png | Bin 612 -> 0 bytes src/assets/img/cursor-rock.png | Bin 476 -> 0 bytes src/assets/img/cursor-text.png | Bin 137 -> 0 bytes src/assets/svg/cursors/CursorAuto.svg | 4 ++++ src/assets/svg/cursors/CursorDead.svg | 8 +++++++ src/assets/svg/cursors/CursorDeadClicked.svg | 8 +++++++ src/assets/svg/cursors/CursorHorns.svg | 6 +++++ src/assets/svg/cursors/CursorHornsClicked.svg | 6 +++++ src/assets/svg/cursors/CursorPointer.svg | 6 +++++ .../svg/cursors/CursorPointerClicked.svg | 6 +++++ src/assets/svg/cursors/CursorText.svg | 4 ++++ src/components/Navigation.astro | 6 ++--- src/components/ProjectLogo.astro | 6 ++++- src/sections/Intro.astro | 2 +- src/styles/global.css | 22 ++++-------------- 20 files changed, 64 insertions(+), 23 deletions(-) create mode 100644 src/assets/img/README.md delete mode 100644 src/assets/img/cursor-auto.png delete mode 100644 src/assets/img/cursor-dead.png delete mode 100644 src/assets/img/cursor-pointer-clicked.png delete mode 100644 src/assets/img/cursor-pointer.png delete mode 100644 src/assets/img/cursor-rock-clicked.png delete mode 100644 src/assets/img/cursor-rock.png delete mode 100644 src/assets/img/cursor-text.png create mode 100644 src/assets/svg/cursors/CursorAuto.svg create mode 100644 src/assets/svg/cursors/CursorDead.svg create mode 100644 src/assets/svg/cursors/CursorDeadClicked.svg create mode 100644 src/assets/svg/cursors/CursorHorns.svg create mode 100644 src/assets/svg/cursors/CursorHornsClicked.svg create mode 100644 src/assets/svg/cursors/CursorPointer.svg create mode 100644 src/assets/svg/cursors/CursorPointerClicked.svg create mode 100644 src/assets/svg/cursors/CursorText.svg diff --git a/src/assets/img/README.md b/src/assets/img/README.md new file mode 100644 index 0000000..2aac4c2 --- /dev/null +++ b/src/assets/img/README.md @@ -0,0 +1,3 @@ +# Images + +Place any images here that we want optimized by Astro. Otherwise, put pre-optimized images in the `/public` folder. diff --git a/src/assets/img/cursor-auto.png b/src/assets/img/cursor-auto.png deleted file mode 100644 index c95fac3abdba00d0876034e6a14710b539147483..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 394 zcmV;50d@X~P)@eN(G z0p<}*09;v?l0cYj09;j7D&hya;Q}l`tN_$?Et4df%`glKak~nDA0^-S1^#c#zP1HS zpXJSp!?DlBfSJSJq5B0D(A8o<-}lmS96cA3rfH;Y+k>_%nQ5BzFV}P}f5pT1?O{S3 o&Hxa)AE$TF06jtnyMCVk0SvKrTO6oJssI2007*qoM6N<$f`ILpdH?_b diff --git a/src/assets/img/cursor-dead.png b/src/assets/img/cursor-dead.png deleted file mode 100644 index f5338e79b70551be8ff2d18bb1924dbe71c952d0..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 784 zcmV+r1MmEaP)kdg0002TX+uL$X=7sm z0C?J!(7j5-U;swpC#BNGLD5M%4*7e4eaawxj!) z)d3$k3uV>d2g!R=Hbmz*e7l)m5GB|v@?`)-*v;m**EmAoSS8b{1*u#ncIniB4Z8vQ zt}MiYg;J~X>e-9NvDi|*_B^fKnOwVS^#6OARw;naaQFvkEi!W6pG6h`000SaNLh0L z01FcU01FcV0GgZ_0005+Nkld_cr&CXF&Mi-Cx2q{w^3URCEE_m^qMoGYBnsNbD1 zuT4ZwQDhErRMpesZcmDBsxB9Ai-CFjMC1-dM9iuBTnf9Z>Q)i4#k_728Hxym_KMhQ z-YXGt*u2AWfvZy3K~7__7hN}=*Sdx_#sbjP_Fjxp=Ma-F#g=IL$A_2!4L&QDK+9}pK;S~`d z_)fyTU^7c7V?V~Mo*1tyzKxy4TFM1JlVggTd?ZVP`#dEC}pky diff --git a/src/assets/img/cursor-pointer-clicked.png b/src/assets/img/cursor-pointer-clicked.png deleted file mode 100644 index c99ebc1987e159626ac939b49abc7c4e8ab587e1..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 716 zcmV;-0yF)IP)zy+r0#S&qz;8b zr1pBfP_0&XIqdnXOhU*lae~Y&NP3kW8mj`unOUpx5hpxS~WN z5m}q?7ahD^mTlNC40C zASd;Doi?WAWW9(m&k&#lgFzULMj)2uatXOyZom0^L@P&tO1wmXxgmvgIt?7h{c|ez z`+X>tN?^C!g}vsVkQ++gginz*0xY;e$%XTGN=i!qxw*L^mSWkdg0005RNkl9LMqZsnI2fBo1vs;1D-7l#9zr4Ov4*(UM6Gfi@L1*dS3`5mXdGU{qVskQz1A z4MKlFX9vwe1V>cZQI{Qe-aDv=jdwR0uR_u7iO@w9Q|}C$#=wU zl^`)ohei=cT=$lUJf=hAhzHbHBC^y~U{YQAPl1nIW31~yZ8tX?kVWoslmtx;ae?J< zpw~N2g)>X^(a=7=Acg}e^{s^WoEuEiL(CRFU^K8t&5C&4i{VTr{-J5aVHeyR1Tvw( zfcjO!yG_J2;wg0@2rLJIRdG;V6LH2l5&1;K8N}1-Bk_ouchoCt(X_L*z&Ew8jFg)O z(#8aVHFfJcV#k516CT#?1A*3o*W%gD1T=4@i@!4_9Kp!Y$-1ypNZIk zn5?ueJQI->V%{S@wUt9Z5V=guJYuR+v6)q=A~HhEFn`-uZLH|-Ux+MH*Lg&|-|+n4 zZ$yghqOJrl5%HV_qjIMHoy#;0_45W12g~zjEvs7ag~!T0RYYWtrjk5Fg7sF1N&_XV z?I$N`!vr~uZG$K5q)iFNxl5K}@O2q3)j$3NZeuU?C>TgI00000NkvXXu0mjfk~87x diff --git a/src/assets/img/cursor-rock-clicked.png b/src/assets/img/cursor-rock-clicked.png deleted file mode 100644 index 288d921943ed61f8dd6253a0bd397765d8ee1511..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 612 zcmV-q0-ODbP)kdg00009a7bBm000XU z000XU0RWnu7ytkQ7D+@wRCwCW&^t(#VI0TtZ&`FxODzZ&7qQavNDe`T8ni~?WvQXS zph+BZC`^(lyO2xNoP$e41rb6+P(qVbkVDZ>f#fAJ^PUGg-v%F0e0|T!rar&n&jbJG z_rSw{sE9}W;x{ij$Un%=8o-bwHLO}AVzDPgq>oi=M|`4|&LHzFx0wuD5Fe{YW)Rs1 z!CEdbjC|)B8;Erdu}iH@B65dDvH`e)81j%=P;HP6s+sxBD-0#I1%O?P!I}pV+%UwOJFPIVKFBZ<~OrLb5*KBYhjc@%{k(_x05WyC7AM=W=#Ip@_Gvs~k}x;}-xAtH&DYOh%2 zN?zEbYF-NYNW>4^rM?yOOs7a>kccl>sE)bAgy|$iCW&~5*(udIlcsY>L?WIePMKL% zOu;?GUNb8enI)nYvB^wEMC3IQn;69{4w>Ff5xEUfZHUKArF}n7M9Ls)6CV)I$5zZ) zEg}zyv5yJF2FHvVGW`DtJBd}rIAXq+{pzAYue(h|#yLP*d+5i7?6uCbHkc4YKC_>U yHqgR1jAWKha`{Uesi%wgBoP_lDNSr&Y4H!8C%6nx!a}tG0000kdg00009a7bBm000XU z000XU0RWnu7ytkPj!8s8RCwB@&P_{HQ2>YWC!s}~f?D+A#VH8V1f!yXY$2`s1a0~T z8MWyf6quAPBHFZVGfTlhcSBU*1nt~K2#VPvu!*tp1$`6_7YF8Y@3}M2e|ygF95Sl% zi9P;P<2*fdZD0!t`^ia4H;Z`5(}8$O>3-oU+cpAFqjZ0;|W)+8-OjZdr#GIFWZg)#M_zz84Zh# zd|)CM_~r-q`v5}4z>;{QA3(pm-Yam+n5t$2O-zg_5oyxZBI1fgt%}GZT}>grvZ$E= zOwrXCV&bNGZJGpNjEoi#C(Ub8L>9RjX1 S{T^Ka0000k4U0iG_7Ar-fh4{$v*_>=sjpRX~g zSh9nq{(zLhLwTR2Dmxi8{7fFC2rxM1t_VvN;MZ_75@?WOU|r1CBV~|vU + + diff --git a/src/assets/svg/cursors/CursorDead.svg b/src/assets/svg/cursors/CursorDead.svg new file mode 100644 index 0000000..a32d7fb --- /dev/null +++ b/src/assets/svg/cursors/CursorDead.svg @@ -0,0 +1,8 @@ + + + + + diff --git a/src/assets/svg/cursors/CursorDeadClicked.svg b/src/assets/svg/cursors/CursorDeadClicked.svg new file mode 100644 index 0000000..7c8bfb4 --- /dev/null +++ b/src/assets/svg/cursors/CursorDeadClicked.svg @@ -0,0 +1,8 @@ + + + + + diff --git a/src/assets/svg/cursors/CursorHorns.svg b/src/assets/svg/cursors/CursorHorns.svg new file mode 100644 index 0000000..13bb4e1 --- /dev/null +++ b/src/assets/svg/cursors/CursorHorns.svg @@ -0,0 +1,6 @@ + + + + diff --git a/src/assets/svg/cursors/CursorHornsClicked.svg b/src/assets/svg/cursors/CursorHornsClicked.svg new file mode 100644 index 0000000..21c51df --- /dev/null +++ b/src/assets/svg/cursors/CursorHornsClicked.svg @@ -0,0 +1,6 @@ + + + + diff --git a/src/assets/svg/cursors/CursorPointer.svg b/src/assets/svg/cursors/CursorPointer.svg new file mode 100644 index 0000000..4dbfb53 --- /dev/null +++ b/src/assets/svg/cursors/CursorPointer.svg @@ -0,0 +1,6 @@ + + + + diff --git a/src/assets/svg/cursors/CursorPointerClicked.svg b/src/assets/svg/cursors/CursorPointerClicked.svg new file mode 100644 index 0000000..0d2bfb7 --- /dev/null +++ b/src/assets/svg/cursors/CursorPointerClicked.svg @@ -0,0 +1,6 @@ + + + + diff --git a/src/assets/svg/cursors/CursorText.svg b/src/assets/svg/cursors/CursorText.svg new file mode 100644 index 0000000..4b16968 --- /dev/null +++ b/src/assets/svg/cursors/CursorText.svg @@ -0,0 +1,4 @@ + + + diff --git a/src/components/Navigation.astro b/src/components/Navigation.astro index 39ac4f0..75670df 100644 --- a/src/components/Navigation.astro +++ b/src/components/Navigation.astro @@ -160,7 +160,7 @@ const {id, items = []} = Astro.props; text-transform: uppercase; letter-spacing: 0.2rem; white-space: nowrap; - /* Required for the `rock` cursor to work. */ + /* Required for the `horns` cursor to work. */ pointer-events: none; } @@ -182,7 +182,7 @@ const {id, items = []} = Astro.props; html[data-current-index='12'] .Item:nth-child(13) .Link, html[data-current-index='13'] .Item:nth-child(14) .Link, html[data-current-index='14'] .Item:nth-child(15) .Link { - cursor: url('../assets/img/cursor-rock.png'), not-allowed; + cursor: url('../assets/svg/cursors/CursorHorns.svg'), not-allowed; color: var(--color-primary); translate: calc(var(--nav-item-shift-x) * -1) 0; } @@ -202,7 +202,7 @@ const {id, items = []} = Astro.props; html[data-current-index='12'] .Item:nth-child(13) .Link:active, html[data-current-index='13'] .Item:nth-child(14) .Link:active, html[data-current-index='14'] .Item:nth-child(15) .Link:active { - cursor: url('../assets/img/cursor-rock-clicked.png'), not-allowed; + cursor: url('../assets/svg/cursors/CursorHornsClicked.svg'), not-allowed; } html[data-current-index='0'] .Item:nth-child(1) .Link::before, diff --git a/src/components/ProjectLogo.astro b/src/components/ProjectLogo.astro index 391955a..6742f60 100644 --- a/src/components/ProjectLogo.astro +++ b/src/components/ProjectLogo.astro @@ -68,7 +68,11 @@ const iconProps = { } div.ProjectLogo { - cursor: url('../assets/img/cursor-dead.png'), not-allowed; + cursor: url('../assets/svg/cursors/CursorDead.svg'), not-allowed; + + &:active { + cursor: url('../assets/svg/cursors/CursorDeadClicked.svg'), not-allowed; + } } .ProjectLogo > [data-icon] { diff --git a/src/sections/Intro.astro b/src/sections/Intro.astro index b504cb2..8d4c265 100644 --- a/src/sections/Intro.astro +++ b/src/sections/Intro.astro @@ -24,7 +24,7 @@ const {id, thumbnail} = Astro.props; Background image photographed by: Curtis Dulmage

-