MDB 8 - Skin not working


Topic: MDB 8 - Skin not working

Deloitte Developer free asked 3 years ago

Hi can you help me to get my skin to work again? Or does this feature doesnt exist anymore?

Greetings.

Expected behavior Skins working.

Actual behavior Skins not working. No asset with the name skins available.

Resources (screenshots, code snippets etc.)


Damian Gemza staff answered 3 years ago

Guys,

You have to add @import "~ng-uikit-pro-standard/assets/scss/core/msc/skins-pro"; import to the global styles.scss stylesheet to fix problem with skins.

Please take a look at the below code - this is my global styles.scss stylesheet where my custom-skin is working fine with MDB 8:

$skins: () !default;
$skins: map-merge((
  "custom": (
    "skin-primary-color": #fff,
    "skin-navbar": #fff,
    "skin-footer-color": #fff,
    "skin-accent": #fff,
    "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);

/* You can add global styles to this file, and also import other style files */
@import '~ng-uikit-pro-standard/assets/scss/core/mixins';
@import '~ng-uikit-pro-standard/assets/scss/core/colors';
@import '~ng-uikit-pro-standard/assets/scss/core/variables';
@import '~ng-uikit-pro-standard/assets/scss/core/variables-pro';
@import '~ng-uikit-pro-standard/assets/scss/core/msc/skins-pro';

Best Regards,

Damian


Deloitte Developer free commented 3 years ago

Thank you Damian! This works!


Damian Gemza staff answered 3 years ago

Guys,

The skins are working fine. They are imported in msc-pro.scss file which is imported in mdb.scss file.

Which skins are you using? Custom or predefined?

Best Regards,

Damian


Deloitte Developer free commented 3 years ago

We are using a Custom defined Skin in. Its defined in the styles.scss.


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.0.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No