form.sass in bulma-rails-0.0.28

- old
+ new

@@ -13,24 +13,15 @@
   &[type="search"]
     border-radius: 290486px
   // Sizes
   &.is-small
     +control-small
-    &.is-flat
-      padding: 4px 6px
   &.is-medium
     +control-medium
-    &.is-flat
-      padding: 4px 10px
   &.is-large
     +control-large
-    &.is-flat
-      padding: 4px 12px
   // Modifiers
-  &.is-flat
-    border: none
-    box-shadow: none
   &.is-fullwidth
     display: block
     width: 100%
   &.is-inline
     display: inline
@@ -96,10 +87,25 @@
     right: 16px
     top: 50%
   &:hover
     &:after
       border-color: $link-hover
+  &.is-small
+    height: 24px
+    select
+      +control-small
+      padding-right: 28px
+  &.is-medium
+    height: 40px
+    select
+      +control-medium
+      padding-right: 44px
+  &.is-large
+    height: 48px
+    select
+      +control-large
+      padding-right: 52px
 
 .label
   color: $text-strong
   display: block
   font-weight: bold
@@ -138,10 +144,11 @@
     .button,
     .input,
     .select
       border-radius: 0
       margin-right: -1px
+      width: auto
       &:hover
         z-index: 2
       &:active,
       &:focus
         z-index: 3
@@ -151,14 +158,21 @@
           border-radius: $radius 0 0 $radius
       &:last-child
         border-radius: 0 $radius $radius 0
         select
           border-radius: 0 $radius $radius 0
+      &.is-expanded
+        flex: 1
     &.has-addons-centered
       justify-content: center
     &.has-addons-right
       justify-content: flex-end
+    &.has-addons-fullwidth
+      .button,
+      .input,
+      .select
+        flex: 1
   &.has-icon
     & > .fa
       +fa(14px, 24px)
       color: $text-light
       pointer-events: none
@@ -212,16 +226,15 @@
           & + .fa
             right: 12px
   &.is-grouped
     display: flex
     justify-content: flex-start
-    & > .button,
-    & > .input,
-    & > .select
+    & > .control
       &:not(:last-child)
+        margin-bottom: 0
         margin-right: 10px
-    & > .input
-      flex: 1
+      &.is-expanded
+        flex: 1
     &.is-grouped-centered
       justify-content: center
     &.is-grouped-right
       justify-content: flex-end
   &.is-horizontal