@SaruMakes
Posted
@tunaerten, try having a look at my solution for this challenge, if you want to see one way to do the shadow animation (FYI: as per the figma file, it also needs to be different between mobile and desktop). 🙂
As for the mouse cursor, there isn't a ton of stuff you can really do with it, to my knowledge. What you can do is, as you said, to replace the image with a different one. If you look closely, you'll find that the cursor for the design is actually hidden in the Figma file too, if you want to use the exact same cursor as the design. 😉
I hope that helps!
Marked as helpful
@tunaerten
Posted
@SaruMakes I didn't realize that shadow was an animation. I will review and fix my code again. Additionally, I will thoroughly re-examine the Figma file for the cursor. (I haven't fully understood how to use Figma yet, but I'm working on it.) I really liked your HTML. You have used semantic elements nicely. I think you could gather all the media queries in one place. Of course, I don't know if you have another purpose.
@SaruMakes
Posted
@tunaerten Thank you for your critique as well! I had already considered that I should gather the media queries as you say. So far, its been helpful for me to have it split up that way, as I work my way through the sections and add the media queries, but I think I need to find a different workflow for it regardless. 😅 I'm very much also wanting to get better at writing DRY code, so I don't repeat myself more than I have to.
You can find the hand cursor in the Desktop - Active frame in the Figma file. It'll be under Frame 3 > Content > Handcursor. You can then export it as a .png or .svg to use on your site (just don't re-use it elsewhere).
