diff --git a/CHANGELOG.md b/CHANGELOG.md index 97aa595f..64ece6b9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,8 +2,12 @@ ### Added -* `.control.is-inline` for horizontal forms +* `.pagination` +* `.control.is-horizontal` for horizontal forms +* `.help` for controls ### Updated +* `.button` needs an `.icon` now * `.control.is-grouped` renamed to `.control.has-addons` +* `.control.is-inline` renamed to `.control.is-grouped` diff --git a/bulma/elements/buttons.sass b/bulma/elements/buttons.sass index 223f32e7..cf4081dc 100644 --- a/bulma/elements/buttons.sass +++ b/bulma/elements/buttons.sass @@ -67,6 +67,14 @@ background: rgba(black, 0.05) &.is-loading:after border-color: transparent transparent $color-invert $color-invert !important + &.is-link + border-color: transparent + color: $text + text-decoration: underline + &:hover, + &:focus + background: $border + color: $text-strong &.is-small +button-small .icon.is-small diff --git a/bulma/elements/controls.sass b/bulma/elements/controls.sass index fb478da9..4d341afd 100644 --- a/bulma/elements/controls.sass +++ b/bulma/elements/controls.sass @@ -31,10 +31,8 @@ +control @each $name, $pair in $colors $color: nth($pair, 1) - $color-invert: nth($pair, 2) &.is-#{$name} border-color: $color - color: $color =control-small border-radius: 2px @@ -188,14 +186,29 @@ .label color: $text-strong display: block + font-weight: bold &:not(:last-child) margin-bottom: 5px +.help + display: block + font-size: $size-small + margin-top: 5px + @each $name, $pair in $colors + $color: nth($pair, 1) + &.is-#{$name} + color: $color + +// Containers + .control-label - flex: 1 - margin-right: 20px - padding-top: 7px - text-align: right + +mobile + margin-bottom: 5px + +tablet + flex: 1 + margin-right: 20px + padding-top: 7px + text-align: right .control position: relative @@ -210,17 +223,25 @@ margin-bottom: 10px &.has-icon & > .fa - +fa(14px, 20px) + +fa(14px, 16px) color: $text-light - left: 6px pointer-events: none position: absolute - top: 6px + top: 8px z-index: 4 .input - padding-left: 32px &:focus + .fa - color: $control-active + color: $text-strong + &:not(.has-icon-right) + & > .fa + left: 8px + .input + padding-left: 32px + &.has-icon-right + & > .fa + right: 8px + .input + padding-right: 32px &.has-addons display: flex .input, @@ -251,7 +272,8 @@ & > .input flex: 1 &.is-horizontal - display: flex - & > .control + +tablet display: flex - flex: 5 + & > .control + display: flex + flex: 5