Submitted about 3 years ago

Solution using SASS Flexbox, Grid & javascript DOM

Antonio Novak•480

@Nova988

Preview site View code

This is a solution for...Time tracking dashboard

HTML
CSS
JS

2junior

Design comparison

SolutionDesign

Solution retrospective

Hello,

I would like some feedback and help on the following points:

The cards of the dashboard are not like the design when I hover over them. How can i fix this? I think it has something to do with the way I made the the color space above the card. Could i code this in a different and better way?
How can I make it so that the opacity of the card is set back to default when I hover over the 3 dots in the card (menu).

I will appreciate any other feedback on my code or design.

Community feedback

Clément Creusat•1,655
@ccreusatPosted about 3 years ago
Hello !

First, good job!

Then:

I suggest your change the hover effect with the right background-color > #33397a rather than an opacity: 0.8;

I think it would be hard to no hovering the card knowing that the 3 dots are in the card. So this a total normal behavior. Maybe you could handle that with JavaScript (mouseover/mouseout) and adding active classes when needed
0

Please log in to post a comment

Join 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