Custom colors dont work

Topic: Custom colors dont work

sandermann free asked 3 years ago

Expected behavior Showing upsetted color for default-color

Actual behavior color does not change

Resources (screenshots, code snippets etc.) In my styles scss I imported @import "~ng-uikit-pro-standard/assets/scss/core/colors"; Then I setup default color with $default-color: #ffffff !default;

when I use default color in html the standard color for default is showing up, not the color I set up for default, in this case white.

Grzegorz Bujański staff commented 3 years ago

Can you provide more details? I checked it with navbar and the .navbar-nav class and the color changed:

$default-color: #dd5151 !default;

.navbar-nav {
  background-color: $default-color;
}

enter image description here

sandermann free commented 3 years ago

I have a navbar and with that: <div *dropdownMenu class="dropdown-menu dropdown dropdown-default" role="menu"> in it. The dropdown-default option changed the color of the hover effect. But here I have the standard default color, not that color I defined by myself.

Add comment

Arkadiusz Idzikowski staff answered 3 years ago

0 0 Best answer

Please insert min. 20 characters.

We use modular styles for components. Component styles are pre-compiled and loaded when the component appears in the application view. Therefore, changing the scss variable will have no effect on the component appearance.

In this case we recommend to override specific parameter in the component class (background-color in .navbar-nav in this case). You can read more about styles customization in our guide: https://mdbootstrap.com/docs/angular/getting-started/styles-customization/

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB Angular
MDB Version: 10.1.1
Device: Desktop
Browser: Chrome latest
OS: Windows 10 latest
Provided sample code: Yes
Provided link: No

sandermann

25Support score
3Questions 1Answers 0Snippets