search

loogart / impact-canada

Canadian Government's Privy Council's Office Impact Canada website.
https://loogart.github.io/impact-canada/
0 stars 0 forks source link

Navbar active #31

Closed loogart closed 5 years ago

loogart commented 5 years ago

When a new top level page loads (about, how it works, etc...), the red bottom border pulses on load (the height pops up and goes back down to regular height. I'm not sure how to troubleshoot it. You will see it if you click from 1 page to another in the navigation bar.

nav.navigation-bar .navigation__items .menu a.is-active { border-bottom: 0.69rem solid #E25456; background-color: inherit; }

djsutter commented 5 years ago

I did see this but not sure yet why it's happening.

loogart commented 5 years ago

it happens only in chrome. Upon inspecting the browser, the only difference I can notice is that my prototype has a div.menu > a and the qualivera version is built with ul.menu.nav.navbar > li > a. Another idea would be to add the property border-bottom: 0.69rem solid transparent; to the class nav.navigation-bar .navigation__items .menu a.

djsutter commented 5 years ago

Fixed it! It was transition: all 0.15s ease-out;