Sketch widget in 4.21 - how to change color and size of the sketch tools

203
1
Jump to solution
10-06-2021 10:32 AM
MKY
by
New Contributor III

In 4.20 I used .esr-widget--button class to chage color and size. In 4.21 the sketch widget uses calcite components and calcite icon. How can I overide the default color by using css?

0 Kudos
1 Solution

Accepted Solutions
JoseBanuelos
Esri Contributor

Hello @MKY ,

This is a good question. The Sketch widget is using calcite-actions, so in order to update the default color of the Sketch widget buttons, then the following css override will work. This is documented here:
https://developers.arcgis.com/calcite-design-system/foundations/colors/#primary-colors

calcite-action {
  --calcite-ui-foreground-1: rgba(240,186,180,0.5);
}

 

Unfortunately, you are currently unable to override the size of the calcite-actions in the Sketch widget. We are aware of this, and we are discussing how to improve this workflow.

Thanks,

Jose

View solution in original post

1 Reply
JoseBanuelos
Esri Contributor

Hello @MKY ,

This is a good question. The Sketch widget is using calcite-actions, so in order to update the default color of the Sketch widget buttons, then the following css override will work. This is documented here:
https://developers.arcgis.com/calcite-design-system/foundations/colors/#primary-colors

calcite-action {
  --calcite-ui-foreground-1: rgba(240,186,180,0.5);
}

 

Unfortunately, you are currently unable to override the size of the calcite-actions in the Sketch widget. We are aware of this, and we are discussing how to improve this workflow.

Thanks,

Jose

View solution in original post