[Designer] How can I change the css of custom button in toolbar?

[ZaiD026]

I have added the custom button in the toolbar by following the documentation present.
/* Modify the toolbar */
let myButton = new Designer.ToolbarButton(
"myButton",
"My button",
null,
(sender) => { alert("My button was clicked"); });

now I need to change its CSS to make it more visible and different from other how to do it?

[jwoo-msft]

@anna-dingler?

[anna-dingler]

Hi @ZaiD026,

Can you try passing an iconClass to the constructor instead of null (string, no spaces).

AdaptiveCards/source/nodejs/adaptivecards-designer/src/toolbar.ts

Lines 127 to 137 in 6249d09

	constructor(
	id: string,
	caption: string,
	iconClass: string,
	onClick: (sender: ToolbarButton) => void = null) {
	super(id);
	this.caption = caption;
	this.iconClass = iconClass;
	this.onClick = onClick;
	}

You should then be able to use it as the class name for CSS styling that will apply to this button only.