Increase controls size, Update base colors

This commit is contained in:
Jeremy Thomas 2019-10-12 21:44:57 +01:00
parent 4a84aa1555
commit 639e09e2c3
5 changed files with 21 additions and 17 deletions

View File

@ -5,8 +5,8 @@ $button-family: false !default
$button-border-color: $grey-lighter !default $button-border-color: $grey-lighter !default
$button-border-width: $control-border-width !default $button-border-width: $control-border-width !default
$button-padding-vertical: calc(0.375em - #{$button-border-width}) !default $button-padding-vertical: calc(0.5em - #{$button-border-width}) !default
$button-padding-horizontal: 0.75em !default $button-padding-horizontal: 1em !default
$button-hover-color: $link-hover !default $button-hover-color: $link-hover !default
$button-hover-border-color: $link-hover-border !default $button-hover-border-color: $link-hover-border !default
@ -240,8 +240,8 @@ $button-static-border-color: $grey-lighter !default
pointer-events: none pointer-events: none
&.is-rounded &.is-rounded
border-radius: $radius-rounded border-radius: $radius-rounded
padding-left: 1em padding-left: calc(#{$button-padding-horizontal} + 0.25em)
padding-right: 1em padding-right: calc(#{$button-padding-horizontal} + 0.25em)
.buttons .buttons
align-items: center align-items: center

View File

@ -1,3 +1,7 @@
$textarea-padding: $control-padding-horizontal !default
$textarea-max-height: 40em !default
$textarea-min-height: 8em !default
%input-textarea %input-textarea
@extend %input @extend %input
box-shadow: $input-shadow box-shadow: $input-shadow
@ -34,8 +38,8 @@
@extend %input-textarea @extend %input-textarea
&.is-rounded &.is-rounded
border-radius: $radius-rounded border-radius: $radius-rounded
padding-left: 1em padding-left: calc(#{$control-padding-horizontal} + 0.375em)
padding-right: 1em padding-right: calc(#{$control-padding-horizontal} + 0.375em)
&.is-static &.is-static
background-color: transparent background-color: transparent
border-color: transparent border-color: transparent
@ -48,11 +52,11 @@
display: block display: block
max-width: 100% max-width: 100%
min-width: 100% min-width: 100%
padding: 0.625em padding: $textarea-padding
resize: vertical resize: vertical
&:not([rows]) &:not([rows])
max-height: 600px max-height: $textarea-max-height
min-height: 120px min-height: $textarea-min-height
&[rows] &[rows]
height: initial height: initial
// Modifiers // Modifiers

View File

@ -2,7 +2,7 @@ $input-color: $grey-darker !default
$input-background-color: $white !default $input-background-color: $white !default
$input-border-color: $grey-lighter !default $input-border-color: $grey-lighter !default
$input-height: $control-height !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-placeholder-color: rgba($input-color, 0.3) !default
$input-hover-color: $grey-darker !default $input-hover-color: $grey-darker !default

View File

@ -3,11 +3,11 @@ $control-radius-small: $radius-small !default
$control-border-width: 1px !default $control-border-width: 1px !default
$control-height: 2.25em !default $control-height: 2.5em !default
$control-line-height: 1.5 !default $control-line-height: 1.5 !default
$control-padding-vertical: calc(0.375em - #{$control-border-width}) !default $control-padding-vertical: calc(0.5em - #{$control-border-width}) !default
$control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default $control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default
=control =control
-moz-appearance: none -moz-appearance: none

View File

@ -16,13 +16,13 @@ $white-bis: hsl(0, 0%, 98%) !default
$white: hsl(0, 0%, 100%) !default $white: hsl(0, 0%, 100%) !default
$orange: hsl(14, 100%, 53%) !default $orange: hsl(14, 100%, 53%) !default
$yellow: hsl(48, 100%, 67%) !default $yellow: hsl(48, 100%, 53%) !default
$green: hsl(141, 71%, 48%) !default $green: hsl(141, 53%, 53%) !default
$turquoise: hsl(171, 100%, 41%) !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 $blue: hsl(217, 71%, 53%) !default
$purple: hsl(271, 100%, 71%) !default $purple: hsl(271, 100%, 71%) !default
$red: hsl(348, 100%, 61%) !default $red: hsl(348, 86%, 61%) !default
// Typography // Typography