Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Override primary-button shadow by sass

norbertbede premium asked 1 year ago


hi,

i would like replace primary-buton trough saas way, i tried these two forms, always getting error - undefined variable or mixin variable.

i use this approach https://mdbootstrap.com/support/angular/variable-undefined-theme-colors-rgb-and-theme-colors/

@mixin btn-primary { @include box-shadow(none); }

.btn-primary { @include box-shadow(none); color:rgba(33, 33, 33, 0.15); }

what is the right approach. where can i find a documentation ? nb


Arkadiusz Idzikowski staff commented 1 year ago

Could you please edit your post and provide more information about the error messages and the full SCSS code that you used? After importing mdb.scss you should have access to all the variables and mixins.


norbertbede premium commented 1 year ago

Arkadiusz, can you provide version ? This is really core bug. n



We could not reproduce this problem on our end. If you imported the mdb.scss file in your styles.scss you should be able to use mixins like box-shadow in your SCSS code (defined after mdb.scss import).

If you just want to remove the shadow from .btn-primary class using box-shadow mixin, then this code should work correctly:

@import "mdb-angular-ui-kit/assets/scss/mdb.scss";

.btn-primary {
  @include box-shadow(none);
}

norbertbede premium commented 1 year ago

sorry. yes, i made mistake. i thought

https://mdbootstrap.com/support/angular/buttons-colors-map-has-secondary-color-hardcoded-e3ebf7/

this a problem for us.


Arkadiusz Idzikowski staff commented 1 year ago

Unfortunately, this problem is a bit more complicated than we thought and will take more time to solve. We plan to rebuild and improve the entire theming system soon, and during this work we will also solve the problem with hardcoded values.

You can still override all the values in this SCSS $buttons map. Please let us know if you need any help with that.



Please insert min. 20 characters.

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: Premium
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 5.1.0
  • Device: desktop
  • Browser: chrome
  • OS: osx
  • Provided sample code: No
  • Provided link: Yes