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: Angular Component do not use skin color

Kloew free asked 4 years ago


Expected behavior DatePicker, Select Label,... all component use the default skin colors Actual behavior the color #4285f4 is fix included in javascript files for the "styles" in the component,

the Button for example use the skin color,

Resources (screenshots, code snippets etc.)

$skins: () !default;

$skins: map-merge(( "nada": ( 'skin-primary-color': $color-nada-blue, 'skin-navbar': #ffff, 'skin-footer-color': #6f7178, 'skin-accent': $color-nada-blue, 'skin-flat': #f9f9f9, 'skin-sidenav-item': $color-nada-blue, 'skin-sidenav-item-hover': #000000, 'skin-gradient-start': #ababab, 'skin-gradient-end': #ffff, 'skin-mask-slight': rgba(#ffff, 0.5), 'skin-mask-light': rgba(#ffff, 0.65), 'skin-mask-strong': rgba(#ffff, 0.8), 'skin-sn-child': $color-nada-blue, 'skin-btn-primary': $color-nada-blue, 'skin-btn-secondary': #fc685f, 'skin-btn-default': #454545, 'skin-text': #424242, ) ), $skins);


<div class="col-md-6">
    <div class="md-form form-group">
      <!--[(ngModel)]="kindOfControl"-->
      <mdb-select input="inputKindOfControl" [options]="kindOfControlOptions" class="colorful-select dropdown-primary"></mdb-select>
      <label for="inputKindOfControl">Art der Kontrolle</label>
    </div>
  </div>


<div class="col-md-6">
    <div class="md-form form-group">
      <mdb-date-picker label="Zeitraum von" name="mydate" ><!--[(ngModel)]="intervalFrom"-->
        </mdb-date-picker>
    </div>
  </div>

Konrad Stępień staff answered 4 years ago


Hi @Kloew,

Can you visit this similar issue? And this documentation page.

If You'll have any questions. I'll very glad to help you.

Best, Konrad.


Kloew free commented 4 years ago

How is the styles part of the angular component in js generated, cannotfind this specification in ts?


Kloew free commented 4 years ago

Hi,

there are for sure some possibilities to override each component style via css !important, but I think this should be best practice that this will happend by default by pro component like select, calender, datepicker....

Idont understand why there is fix the color #4285f4 inside the "styles" in the angular component inside the node_modules

MDBDatePickerComponent = Component(....styles: [.....#4285f4


Konrad Stępień staff commented 4 years ago

Hi @Kloew, I did forward your suggestion for our design team and we have to wait for further information. Either way, if the changes are applied it will probably be breaking change.

How is the styles part of the angular component in js generated, cannotfind this specification in ts?

I don't quite understand this question. This question probably applies to Angular himself. Please visit this page. You can find there more information about angular styles. https://angular.io/guide/component-styles



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: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 9.0.0
  • Device: pc
  • Browser: google chrome
  • OS: win10
  • Provided sample code: No
  • Provided link: No