Topic: skin input colors

German Arutyunov free asked 5 years ago


How to change skin input :focus colors from primary to secondary?

Damian Gemza staff answered 5 years ago


Dear German Arutyunov,

You have to add a new, custom skin into your styles.scss stylesheet, and override there a skin-accent variable's value from #fff to your desired HEX color.

Add below code to your styles.scss stylesheet:

$skins: () !default;

$skins: map-merge((

"custom": (

"skin-primary-color": #fff,

"skin-navbar": #fff,

"skin-footer-color": #fff,

"skin-accent": #000,

"skin-flat": #fff,

"skin-sidenav-item": #fff,

"skin-sidenav-item-hover": #fff,

"skin-gradient-start": #fff,

"skin-gradient-end": #fff,

"skin-mask-slight": #fff,

"skin-mask-light": #fff,

"skin-mask-strong": #fff,

"skin-sn-child": #fff,

"skin-btn-primary": #fff,

"skin-btn-secondary": #fff,

"skin-btn-default": #fff,

"skin-text": #fff

)

), $skins);

@import "~ng-uikit-pro-standard/assets/scss/mdb";

Then you have to copy img and font directories from node_modules/ng-uikit-pro-standard/assets directory to one level above styles.scss localization - propably root level of your application.

PS: Rembember to add class "custom-skin" to index.html body element.

Best Regards,

Damian



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

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags