Topic: Side nav mdb-accordian-item-head active color change
Expected behavior
color should change based on this .side-nav .collapsible .card.active > mdb-accordion-item-head
Actual behavior color will not change even with !important unless the scss is changed within the node module
Resources (screenshots, code snippets etc.)
.side-nav {
.collapsible { .card { .card-header { a { &:hover { background-color: rgba(255, 255, 255, .15); } } } &.active {
mdb-accordion-item-head { background-color:#58595b !important; } .card-header { a { h5 { font-weight: 300; } } } .dark-link { color: #E3E5E7 !important; } } } } }
Dear @tmeyer@suddath.com
Where you're trying to overwrite the styles of the sidenav with the above code? Those styles should be overwritten within the global styles.scss stylesheet.
Your code is working fine for me (when i put it into styles.scss). But you're changing the mdb-accordion-item-head background color only when it's active. Active means, that item is clicked.
When I click on specific mdb-accordion-item-head element, it's changing the background-color.
Best Regards,
Damian
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 7.5.1
- Device: Dell
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: No