MDB Accordion Color


Topic: MDB Accordion Color

dojo44 asked 3 years ago

MDB Accordion Head Font should be the color that I want

mdb-accordion-item-head { span { color: red; } }

I place the above in the scss file. The color did not change from blue. What gives?


Bartosz Termena staff answered 3 years ago

Dear @dojo44

Try to replace your styles.scss with:

mdb-accordion-item-head {
  & .card-header a {
    color: red !important;
  }
}

Best Regards, Bartosz.


dojo44 commented 3 years ago

This worked. I wonder why it did not work in the SCSS file specified in the .TS file though. Tx.


Bartosz Termena staff commented 3 years ago

It's because by default components have view encapsulation (shadow dom). To disable this behavior, you can leverage the encapsulation attribute, as described below:

@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
encapsulation: ViewEncapsulation.None // <------
})

Best, Bartosz.


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: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 8.1.1
  • Device: PC
  • Browser: Chrome
  • OS: Win 10
  • Provided sample code: No
  • Provided link: No
Tags