Flub premium asked 9 months ago


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);


Arkadiusz Idzikowski staff answered 9 months ago


@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 premium commented 9 months 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!



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • User: Premium
  • 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