@Wismal
What are you most proud of, and what would you do differently next time?
I was able to figure out how to use js to change the classes of the share button.
What challenges did you encounter, and how did you overcome them?
working with the svg image and making the tooltip. I used the filter in css to change the color and js to switch them out when an event was triggered. Tooltip I got from googling.
What specific areas of your project would you like help with?
How can I make the tooltip better?
@Wismal
Posted
** Hi mrcordova! **
First of all, good job. I notice you wanted some ideas to make the tooltip better.
I recommend using transitions. Especially in hovers, a transition will make your popup sightly. A good duration for single transitions like this one are between 100-400ms.
** Hope it helped **
Marked as helpful
@kevinebenhezer
Submitted
What are you most proud of, and what would you do differently next time?
Any feedbacks are welcome, thank you!
@Wismal
Posted
Hi, good job! You can do a very easy responsive design if you put a max-width instead of a fixed width and some flex.
Something more. Try to put the number notification to zero as a subtitute of deleting it by changing the innerText/innerHtml Hope it helps
@Wismal
Submitted
What are you most proud of, and what would you do differently next time?
Next time I'll analyse better the images because the bold sentences are links. A reminder for my future projects. In this case it didn't matter, so I chose to leave it like that.
What challenges did you encounter, and how did you overcome them?
Nothing special. Only I thought for creating the circles you needed to custom dots, but it was just a span with a border-radius: 50%
What specific areas of your project would you like help with?
It's a good practice to nest CSS like that? Check the .message in the style.css
@Wismal
Posted
I don't know why but some style doesn't appear in the design comparison
@jessieguinn
Submitted
Any advice on getting it centered in the middle of the page?
@Wismal
Posted
In your parent object, in this case the body, I recommend you to use the properties display:flex or display:grid. Both of them are indispensable for learning front-end. If you use flex, then you have to write "justify-content: center" (centers horizontally) and "align-items: center" (centers vertically). Later, the property "height: 100vh" to ensure that the body takes all the height.
ps: if you use grid, is the same, but you can use the property "place-content: center" instead of the justify and align
