Ionic 2 buttons not mapping color variables

Ionic Framework ionic-v3
1

Hi, i’m trying to use a custom color for an ion-item but putting the attribute doesn’t change the style of the item, tried changing to a button but nothing, then tried changing to an already provided color like danger but nothing.

At this point i will have to mess with ionic-framework code to see where’s the issue, currently using ionic alpha.42 that needs this kind of mapping, the color works say for the navbar but not for buttons:

$colors: (

  primary:    #009688,
  primaryDisabled:   #00665C,
  secondary:  #387ef5,
  danger:     #f53d3d,
  light:      #f4f4f4,
  dark:       #222,
  favorite:   #69BB7B
);

$colors-md: (

  primary:    map-get($colors, primary),
  primaryDisabled:    map-get($colors, primaryDisabled),
  secondary:  map-get($colors, secondary),
  danger:     map-get($colors, danger),
  light:      map-get($colors, light),
  dark:       map-get($colors, dark),
  favorite:   map-get($colors, favorite)
);

$colors-ios: (
  primary:    map-get($colors, primary),
  primaryDisabled:    map-get($colors, primaryDisabled),
  secondary:  map-get($colors, secondary),
  danger:     map-get($colors, danger),
  light:      map-get($colors, light),
  dark:       map-get($colors, dark),
  favorite:   map-get($colors, favorite)
);
2 Likes
2

I have the same experience - it can be reproduced in the conference app by changing the primary color.

3

The thing is that i could override the color for primary to dark green, even the custom color works in normal buttons or in nav bars, the issue is when i try to use it in a button inside a ion-list, the button used the ion-item attribute directive instead of the component, that’s the particular case when none of the color directives (not even primary) works, it just stays white with black font color.