Skip to content

Update hover / active behavior for side navigation links#3511

Merged
mshibuya merged 4 commits into
railsadminteam:masterfrom
codealchemy:side-navigation-updates-post-bs5
May 4, 2022
Merged

Update hover / active behavior for side navigation links#3511
mshibuya merged 4 commits into
railsadminteam:masterfrom
codealchemy:side-navigation-updates-post-bs5

Conversation

@codealchemy

Copy link
Copy Markdown
Contributor

We noticed that the sidenav active / hover behavior from RailsAdmin 2.x did not carry over to RailsAdmin 3.0. This adds hover behavior to the side nav, and the active class to the side nav element that corresponds to the current model context - both of which can be overridden in user themes to maintain the current behavior.

side-nav-check

📝 I'm having trouble getting the 2.x branch running to demo the old behavior, but it can be seen in the demo app linked from the README

This will allow targeted styling of the active element in the side nav
This aligns closer to RailsAdmin 2.x.x, where the background of an element in the side nav changes when it's either active or hovered over - making the navigation itself easier to follow in the UI
Comment on lines +45 to +54
&.active {
background-color: map-get($theme-colors, primary);
color: color-contrast(map-get($theme-colors, primary));
}

&:hover {
background-color: map-get($theme-colors, primary);
color: color-contrast(map-get($theme-colors, primary));
}

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The styles here can be removed if it'd be preferable to keep with the current behavior, 410654d is the main change needed to allow targeting the (active sidenav) element.

@coveralls

Copy link
Copy Markdown

Coverage Status

Coverage remained the same at 94.338% when pulling ac50e18 on codealchemy:side-navigation-updates-post-bs5 into e5bb7ba on railsadminteam:master.

@mshibuya mshibuya merged commit 4a6524a into railsadminteam:master May 4, 2022
@mshibuya

mshibuya commented May 4, 2022

Copy link
Copy Markdown
Member

👍

@codealchemy codealchemy deleted the side-navigation-updates-post-bs5 branch May 4, 2022 14:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants