1 $control-radius: $radius !default
2 $control-radius-small: $radius-small !default
4 $control-border-width: 1px !default
6 $control-height: 2.5em !default
7 $control-line-height: 1.5 !default
9 $control-padding-vertical: calc(0.5em - #{$control-border-width}) !default
10 $control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default
14 -webkit-appearance: none
16 border: $control-border-width solid transparent
17 border-radius: $control-radius
20 font-size: $size-normal
21 height: $control-height
22 justify-content: flex-start
23 line-height: $control-line-height
24 padding-bottom: $control-padding-vertical
25 padding-left: $control-padding-horizontal
26 padding-right: $control-padding-horizontal
27 padding-top: $control-padding-vertical
43 // The controls sizes use mixins so they can be used at different breakpoints
45 border-radius: $control-radius-small
46 font-size: $size-small
48 font-size: $size-medium
50 font-size: $size-large