Wanting to style buttons with outline attribute

#1

Hey all,

I have button with a conditional ‘active’ class:

<ion-button fill=“outline” [class.is-active]=“isOptionSelected(i)”>

The active class is being applied but I cant change any of the CSS custom properties, here is my code:

multi-select-control {
ion-button.is-active.button {
–background: var(–ion-color-primary);
–background-focused: var(–ion-color-primary);
–color: #fff;
–color-activated: #fff;
}
}

The code is working but they styles aren’t applying. Any help appreciated.

#2

If you want just outline you can use fill="outline "…

try this css:

multi-select-control {
    ion-button.is-active.button {
        --background: var(--ion-color-primary);
        --background-focused: var(--ion-color-primary);
        --color: var(--ion-color-light,#fff);
        --color-activated: var(--ion-color-light,#fff);;
    }
}