Design comparison
Solution retrospective
I was able to import my default class settings to quickly get to work. This allowed me to already have a button template for my anchor links and not run into any default User Agent Stylesheet conflicts.
What challenges did you encounter, and how did you overcome them?I am unable to have my cursor pointer change to black when hovering over the anchor elements. I am stuck with the default white pointer
I made css classes for social media anchor elements that did not have a link, in order for the button to not be selectable, but I think I could have done some javascript for this. Maybe that can be my next challenge.
What specific areas of your project would you like help with?Small javascript implementations to avoid CSSing my way there.
Community feedback
- @R3ygoskiPosted 7 months ago
Hello Anthony, congratulations on completing your project and for doing it in a unique way.
Regarding your question about changing the cursor, you have to download a cursor image for that, I honestly don't know any website that offers these cursors. To use it, you can do it like this:
.myClass { cursor: url('./assets/cursor/myBlackPointerCursor.png'), auto; }
This way you will be able to use a custom cursor.
As for using JS to prevent clicking on buttons, I personally don't think it's necessary, you could use CSS itself and make it look disabled, like making the text more gray, or even just delete those buttons from the HTML since they won't be useful.
And again, congratulations, your project turned out very well and unique, if you have any questions, please comment below and I will try to help in the best way possible.
Marked as helpful1@A-Young-GitPosted 7 months ago@R3ygoski Thank you so much! Okay, great. I tried a few urls but it wasn't working. I will dive deeper. Thanks for verifying this for me. Note taken on the disabled button look/removal recommendation. I really appreciate your feedback!
0@R3ygoskiPosted 7 months agoHi @A-Young-Git, no worries, I'm happy to help.
Sorry, I think I explained it a bit wrong. In the
url()
, you should use the path where the png, svg, jpg file you intend to use for the pointer is located, not a website URL.Let's say in your project there's a folder called
assets
, and inside it, there's a folder namedcursor
, and inside that folder, there's a file namedmousePointerBlack.png
. Then you would need to provide the path to that folder, like this:cursor: url('./assets/cursor/mousePointerBlack.png'), auto;
Now, if I misinterpreted your comment, I apologize and thank you for considering my feedback.
Marked as helpful1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord