Customizing Common

The following table lists the available variables for customization.

NameDefault valueDescription
$border-radius 2px Border radius for all components.
$base-bg map-get( $theme, base-bg ) The background of the components' chrome area.
$base-text map-get($theme, component-text) The text color of the components' chrome area.
$base-border rgba( if($theme-type == dark, white, black), .08 ) The border of the components' chrome area.
$base-gradient null The gradient background of the components' chrome area.
$hovered-bg map-get( $theme, hover-bg ) The background of hovered items.
$hovered-text $base-text The text color of hovered items.
$hovered-border rgba( if($theme-type == dark, white, black), .15 ) The border color of hovered items.
$hovered-gradient null The gradient background of hovered items.
$selected-bg $secondary The background of selected items.
$selected-text $secondary-contrast The text color of selected items.
$selected-border rgba( if($theme-type == dark, white, black), .1 ) The border color of selected items.
$selected-gradient null The gradient background of selected items.