Topic: Missing arrows
Expected behavior
Animated arrows for accordion should appear, even when default theme is changed.
Actual behavior
Accordion arrows works well, except if I load a theme. Then they disappear... I have no such problem with any other component.
Resources (screenshots, code snippets etc.)
@import './node_modules/mdb-angular-ui-kit/assets/scss/mdb'; $my-theme-primary: #000000; $my-theme-secondary: #69f0ae; $my-theme: mdb-light-theme($my-theme-primary, $my-theme-secondary); @include mdb-theme($my-theme);
@Flub Thank you for reporting this problem. I can confirm there is a bug in theme styles, we will take a closer look and fix it as soon as possible. As a workaround for now, please try to add these styles after theme include:
.accordion-button:after {
background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%234f4f4f'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 01.708 0L8 10.293l5.646-5.647a.5.5 0 01.708.708l-6 6a.5.5 0 01-.708 0l-6-6a.5.5 0 010-.708z'/></svg>");
}
.accordion-button:not(.collapsed):after {
background-image: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%234f4f4f'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 01.708 0L8 10.293l5.646-5.647a.5.5 0 01.708.708l-6 6a.5.5 0 01-.708 0l-6-6a.5.5 0 010-.708z'/></svg>");
}
Edit: This problem was fixed in v2.3.0
Flub pro premium commented 3 years ago
Indeed, by adding this css, arrows appear fine. I'll use this until future patch.
Many, many, thanks @Arkadiusz Idzikowski for your quick answer & assistance!
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: MDB5 1.6.1
- Device: Fujitsu Laptop
- Browser: Firefox & Chrome
- OS: Windows 11 (10.0.22000.493)
- Provided sample code: No
- Provided link: No