$button-border-color: $grey-lighter !default
$button-border-width: $control-border-width !default
-$button-padding-vertical: calc(0.375em - #{$button-border-width}) !default
-$button-padding-horizontal: 0.75em !default
+$button-padding-vertical: calc(0.5em - #{$button-border-width}) !default
+$button-padding-horizontal: 1em !default
$button-hover-color: $link-hover !default
$button-hover-border-color: $link-hover-border !default
pointer-events: none
&.is-rounded
border-radius: $radius-rounded
- padding-left: 1em
- padding-right: 1em
+ padding-left: calc(#{$button-padding-horizontal} + 0.25em)
+ padding-right: calc(#{$button-padding-horizontal} + 0.25em)
.buttons
align-items: center
+$textarea-padding: $control-padding-horizontal !default
+$textarea-max-height: 40em !default
+$textarea-min-height: 8em !default
+
%input-textarea
@extend %input
box-shadow: $input-shadow
@extend %input-textarea
&.is-rounded
border-radius: $radius-rounded
- padding-left: 1em
- padding-right: 1em
+ padding-left: calc(#{$control-padding-horizontal} + 0.375em)
+ padding-right: calc(#{$control-padding-horizontal} + 0.375em)
&.is-static
background-color: transparent
border-color: transparent
display: block
max-width: 100%
min-width: 100%
- padding: 0.625em
+ padding: $textarea-padding
resize: vertical
&:not([rows])
- max-height: 600px
- min-height: 120px
+ max-height: $textarea-max-height
+ min-height: $textarea-min-height
&[rows]
height: initial
// Modifiers
$input-background-color: $white !default
$input-border-color: $grey-lighter !default
$input-height: $control-height !default
-$input-shadow: inset 0 1px 2px rgba($black, 0.05) !default
+$input-shadow: inset 0 0.0625em 0.125em rgba($black, 0.05) !default
$input-placeholder-color: rgba($input-color, 0.3) !default
$input-hover-color: $grey-darker !default
$control-border-width: 1px !default
-$control-height: 2.25em !default
+$control-height: 2.5em !default
$control-line-height: 1.5 !default
-$control-padding-vertical: calc(0.375em - #{$control-border-width}) !default
-$control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default
+$control-padding-vertical: calc(0.5em - #{$control-border-width}) !default
+$control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default
=control
-moz-appearance: none
$white: hsl(0, 0%, 100%) !default
$orange: hsl(14, 100%, 53%) !default
-$yellow: hsl(48, 100%, 67%) !default
-$green: hsl(141, 71%, 48%) !default
+$yellow: hsl(48, 100%, 53%) !default
+$green: hsl(141, 53%, 53%) !default
$turquoise: hsl(171, 100%, 41%) !default
-$cyan: hsl(204, 86%, 53%) !default
+$cyan: hsl(204, 71%, 53%) !default
$blue: hsl(217, 71%, 53%) !default
$purple: hsl(271, 100%, 71%) !default
-$red: hsl(348, 100%, 61%) !default
+$red: hsl(348, 86%, 61%) !default
// Typography