is-rounded (#1323)

* is-rounded

* padding

sass/elements/button.sass

@@ -199,6 +199,10 @@ $button-static-border-color: $grey-lighter !default
     color: $button-static-color
     box-shadow: none
     pointer-events: none
+  &.is-rounded
+    border-radius: $radius-rounded
+    padding-left: 1em
+    padding-right: 1em
 
 .buttons
   align-items: center

sass/elements/form.sass

@@ -70,8 +70,6 @@ $help-size: $size-small !default
   box-shadow: $input-shadow
   max-width: 100%
   width: 100%
-  &[type="search"]
-    border-radius: 290486px
   &[readonly]
     box-shadow: none
   // Colors
@@ -98,6 +96,8 @@ $help-size: $size-small !default
   &.is-inline
     display: inline
     width: auto
+  &.is-rounded
+    border-radius: $radius-rounded
 
 .input
   &.is-static
@@ -171,6 +171,8 @@ $help-size: $size-small !default
       padding: 0
       option
         padding: 0.5em 1em
+    &.is-rounded
+      border-radius: $radius-rounded
   // States
   &:hover
     &::after
@@ -310,10 +312,16 @@ $help-size: $size-small !default
   &.is-right
     .file-cta
       border-radius: 0 $file-radius $file-radius 0
+      &.is-rounded
+        border-top-right-radius: $radius-rounded
+        border-bottom-right-radius: $radius-rounded
     .file-name
       border-radius: $file-radius 0 0 $file-radius
       border-width: 1px 0 1px 1px
       order: -1
+      &.is-rounded
+        border-top-left-radius: $radius-rounded
+        border-bottom-left-radius: $radius-rounded
   &.is-fullwidth
     .file-label
       width: 100%
@@ -358,6 +366,8 @@ $help-size: $size-small !default
   padding-left: 1em
   padding-right: 1em
   white-space: nowrap
+  &.is-rounded
+    border-radius: $radius-rounded
 
 .file-cta
   background-color: $file-cta-background-color
@@ -425,12 +435,18 @@ $help-size: $size-small !default
         .select select
           border-bottom-left-radius: $input-radius
           border-top-left-radius: $input-radius
+          &.is-rounded
+            border-bottom-left-radius: $radius-rounded
+            border-top-left-radius: $radius-rounded
       &:last-child
         .button,
         .input,
         .select select
           border-bottom-right-radius: $input-radius
           border-top-right-radius: $input-radius
+          &.is-rounded
+            border-bottom-right-radius: $radius-rounded
+            border-top-right-radius: $radius-rounded
       .button,
       .input,
       .select select

sass/elements/image.sass

@@ -1,4 +1,4 @@
-$dimensions: 16 24 32 48 64 96 128 !default
+$dimensions: 16 24 32 48 64 96 128 256 512 !default
 
 .image
   display: block
@@ -7,6 +7,8 @@ $dimensions: 16 24 32 48 64 96 128 !default
     display: block
     height: auto
     width: 100%
+    &.is-rounded
+      border-radius: $radius-rounded
   // Ratio
   &.is-square,
   &.is-1by1,

sass/elements/other.sass

@@ -27,7 +27,7 @@
 .number
   align-items: center
   background-color: $background
-  border-radius: 290486px
+  border-radius: $radius-rounded
   display: inline-flex
   font-size: $size-medium
   height: 2em

sass/elements/progress.sass

@@ -6,7 +6,7 @@ $progress-value-background-color: $text !default
   -moz-appearance: none
   -webkit-appearance: none
   border: none
-  border-radius: 290486px
+  border-radius: $radius-rounded
   display: block
   height: $size-normal
   overflow: hidden

sass/elements/tag.sass

@@ -104,7 +104,7 @@ $tag-delete-margin: 1px !default
     &:active
       background-color: darken($tag-background-color, 10%)
   &.is-rounded
-    border-radius: 290486px
+    border-radius: $radius-rounded
 
 a.tag
   &:hover