I’m having difficulties with the styling of my “Design Projects” cards.
The styling does not seem to be affecting the elements because of a hovering interaction that I built.
If you see the cards, their initial state is not the “more opaque” one. Only once I hover out, the initial state becomes more opaque.
My intention is to have the cards more dimmed down before hovering over them. When hovering out, I want the status to go back to dimmed down.
Would be grateful for a solution to this! Thanks in advance!
I could be wrong but I think the reason the cards are loading in the undimmed state is because on the “card out” animation you have the undimmed state set as initial state which tells the browser to load that as the initial state. uncheck the initial state, it works more how it seems you want it, but there is a timing issue. I think if you set the cards to be “dimmed” in the on-hover animation you might be able to get it the timing back to the way you want it. Hopefully I am making sense!