Fix rounded

docs/documentation/components/pagination.html

@@ -85,6 +85,22 @@ doc-subtab: pagination
 </nav>
 {% endcapture %}
 
+{% capture pagination_rounded_example %}
+<nav class="pagination is-rounded" role="navigation" aria-label="pagination">
+  <a class="pagination-previous">Previous</a>
+  <a class="pagination-next">Next page</a>
+  <ul class="pagination-list">
+    <li><a class="pagination-link" aria-label="Goto page 1">1</a></li>
+    <li><span class="pagination-ellipsis">&hellip;</span></li>
+    <li><a class="pagination-link" aria-label="Goto page 45">45</a></li>
+    <li><a class="pagination-link is-current" aria-label="Page 46" aria-current="page">46</a></li>
+    <li><a class="pagination-link" aria-label="Goto page 47">47</a></li>
+    <li><span class="pagination-ellipsis">&hellip;</span></li>
+    <li><a class="pagination-link" aria-label="Goto page 86">86</a></li>
+  </ul>
+</nav>
+{% endcapture %}
+
 {% capture pagination_small_example %}
 <nav class="pagination is-small" role="navigation" aria-label="pagination">
   <a class="pagination-previous">Previous</a>
@@ -193,6 +209,16 @@ doc-subtab: pagination
 
     {% include snippet.html content=pagination_right_example horizontal=true more=true %}
 
+    {% include anchor.html name="Styles" %}
+
+    {% include elements/new-tag.html version="0.6.2" %}
+
+    <p class="content">
+      Add the <code>is-rounded</code> modifier to have rounded pagination items.
+    </p>
+
+    {% include snippet.html content=pagination_rounded_example horizontal=true more=true %}
+
     {% include anchor.html name="Sizes" %}
 
     <p class="content">

sass/components/pagination.sass

@@ -60,8 +60,8 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($black, 0.2)
   padding-right: 0.5em
   justify-content: center
   margin: 0.25rem
-  text-align: center 
-    
+  text-align: center
+
 .pagination-previous,
 .pagination-next,
 .pagination-link

sass/elements/form.sass

@@ -96,10 +96,12 @@ $help-size: $size-small !default
   &.is-inline
     display: inline
     width: auto
-  &.is-rounded
-    border-radius: $radius-rounded
 
 .input
+  &.is-rounded
+    border-radius: $radius-rounded
+    padding-left: 1em
+    padding-right: 1em
   &.is-static
     background-color: transparent
     border-color: transparent
@@ -153,6 +155,10 @@ $help-size: $size-small !default
       right: 1.125em
       top: 50%
       z-index: 4
+  &.is-rounded
+    select
+      border-radius: $radius-rounded
+      padding-left: 1em
   select
     +input
     cursor: pointer
@@ -171,8 +177,6 @@ $help-size: $size-small !default
       padding: 0
       option
         padding: 0.5em 1em
-    &.is-rounded
-      border-radius: $radius-rounded
   // States
   &:hover
     &::after
@@ -311,17 +315,19 @@ $help-size: $size-small !default
         border-width: 0 1px 1px
   &.is-right
     .file-cta
-      border-radius: 0 $file-radius $file-radius 0
+      &:not(.is-rounded)
+        border-radius: 0 $file-radius $file-radius 0
       &.is-rounded
-        border-top-right-radius: $radius-rounded
         border-bottom-right-radius: $radius-rounded
+        border-top-right-radius: $radius-rounded
     .file-name
-      border-radius: $file-radius 0 0 $file-radius
       border-width: 1px 0 1px 1px
       order: -1
+      &:not(.is-rounded)
+        border-radius: $file-radius 0 0 $file-radius
       &.is-rounded
-        border-top-left-radius: $radius-rounded
         border-bottom-left-radius: $radius-rounded
+        border-top-left-radius: $radius-rounded
   &.is-fullwidth
     .file-label
       width: 100%
@@ -432,21 +438,27 @@ $help-size: $size-small !default
       &:first-child
         .button,
         .input,
-        .select select
-          border-bottom-left-radius: $input-radius
-          border-top-left-radius: $input-radius
+        .select
+          &:not(.is-rounded)
+            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
+            select
+              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
+        .select
+          &:not(.is-rounded)
+            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
+            select
+              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 256 512 !default
+$dimensions: 16 24 32 48 64 96 128 !default
 
 .image
   display: block