Button State Layer

Variables to customize the Button hover, active and focus visual

$gbc-ButtonWidget-hover-color

Border color for Edit Button when hovered

Type: color

Default value: "color.change($mt-white, $alpha: $mt-field-hover-opacity-on-color)"

Computed value: "rgba(255, 255, 255, 0.1)"

Alias (for compatibility): $gbc-ButtonWidget-focus-background-color

$gbc-ButtonWidget-focus-border-width

Border color for Button when focused

Type: number

Default value: "0 - $mt-field-focus-border-width - $gbc-border-xs"

Computed value: "-3px"

$gbc-ButtonWidget-focus-color

Border color for Button when focused

Type: color

Default value: $mt-field-focus-color-on-color

Computed value: "#ffffff"

$gbc-ButtonWidget-active-border-width

Border color for Button when clicked

Type: number

Default value: $mt-field-active-border-width

Computed value: "2px"

$gbc-ButtonWidget-active-color

Border color for Button when clicked

Type: color

Default value: "color.change($mt-field-active-color, $alpha: $mt-field-active-opacity)"

Computed value: "rgba(11, 121, 209, 0.5)"