Variables

These are all the component specific variables that can be used for customization.

Name Value
@alert-background @skin-background
@alert-border-color darken(@alert-background, 5%)
@alert-border-left-width @space-base
@alert-border-radius @border-radius
@alert-border-width 1px
@alert-border 0 solid @alert-border-color
@alert-color @skin-on-background
@alert-line-height @line-height-normal
@alert-margin-vertical @space-16
@alert-padding @space-16
@alert-text-font-size @font-size-large
@alert-title-font-size @font-size-larger
@alert-primary-background lighten(@skin-primary, 30%)
@alert-primary-border darken(@alert-primary-background, 5%)
@alert-primary-color darken(@alert-primary-background, 50%)
@alert-secondary-background lighten(@skin-secondary, 30%)
@alert-secondary-border darken(@alert-secondary-background, 5%)
@alert-secondary-color darken(@alert-secondary-background, 50%)
@alert-info-background lighten(@skin-info, 30%)
@alert-info-border darken(@alert-info-background, 5%)
@alert-info-color darken(@alert-info-background, 50%)
@alert-success-background lighten(@skin-success, 30%)
@alert-success-border darken(@alert-success-background, 5%)
@alert-success-color darken(@alert-success-background, 50%)
@alert-warning-background lighten(@skin-warn, 30%)
@alert-warning-border darken(@alert-warning-background, 5%)
@alert-warning-color darken(@alert-warning-background, 50%)
@alert-error-background lighten(@skin-error, 30%)
@alert-error-border darken(@alert-error-background, 5%)
@alert-error-color darken(@alert-error-background, 50%)
@alert-outlined-background @skin-primary-bg
@alert-link-font-weight @font-weight-medium
@alert-large-padding @space-20