I have a wizard with the following custom wizard buttons:
<clr-wizard-button [type]="'cancel'">Cancel</clr-wizard-button>
<clr-wizard-button [type]="'previous'">Previous</clr-wizard-button>
<clr-wizard-button [type]="'next'">Next</clr-wizard-button>
<clr-wizard-button [type]="'custom-save'">Save</clr-wizard-button>
Now I want to style the button of type custom-save
with a custom color and for this, I need to apply a css-selector. attr.class
won't work.
What is the best way to achieve this?
edit: Formatted html output of the custom-save button:
<clr-wizard-button class="clr-wizard-btn-wrapper" _nghost-c5="" ng-reflect-type="custom-save" ng-reflect-disabled="false" aria-hidden="false">
<button _ngcontent-c5="" class="btn clr-wizard-btn" type="button">
Speichern
</button>
</clr-wizard-button>
Just place a custom class on your ClrWizardButton and it will be rendered for you.
This will render out as you see, where you can target the button using
.my-custom-button button
in your CSS.