Use single file for extends (#3216)

* Use single file for extends

* Update changelog

sass/base/_all.sass

@@ -1,6 +1,6 @@
 /* Bulma Base */
 @charset "utf-8"
 
-@import "minireset.sass"
-@import "generic.sass"
-@import "animations.sass"
+@import "minireset"
+@import "generic"
+@import "animations"

sass/components/_all.sass

@@ -1,15 +1,15 @@
 /* Bulma Components */
 @charset "utf-8"
 
-@import "breadcrumb.sass"
-@import "card.sass"
-@import "dropdown.sass"
-@import "level.sass"
-@import "media.sass"
-@import "menu.sass"
-@import "message.sass"
-@import "modal.sass"
-@import "navbar.sass"
-@import "pagination.sass"
-@import "panel.sass"
-@import "tabs.sass"
+@import "breadcrumb"
+@import "card"
+@import "dropdown"
+@import "level"
+@import "media"
+@import "menu"
+@import "message"
+@import "modal"
+@import "navbar"
+@import "pagination"
+@import "panel"
+@import "tabs"

sass/elements/_all.sass

@@ -1,16 +1,16 @@
 /* Bulma Elements */
 @charset "utf-8"
 
-@import "box.sass"
-@import "button.sass"
-@import "container.sass"
-@import "content.sass"
-@import "icon.sass"
-@import "image.sass"
-@import "notification.sass"
-@import "progress.sass"
-@import "table.sass"
-@import "tag.sass"
-@import "title.sass"
+@import "box"
+@import "button"
+@import "container"
+@import "content"
+@import "icon"
+@import "image"
+@import "notification"
+@import "progress"
+@import "table"
+@import "tag"
+@import "title"
 
-@import "other.sass"
+@import "other"

sass/form/_all.sass

@@ -1,9 +1,9 @@
 /* Bulma Form */
 @charset "utf-8"
 
-@import "shared.sass"
-@import "input-textarea.sass"
-@import "checkbox-radio.sass"
-@import "select.sass"
-@import "file.sass"
-@import "tools.sass"
+@import "shared"
+@import "input-textarea"
+@import "checkbox-radio"
+@import "select"
+@import "file"
+@import "tools"

sass/form/checkbox-radio.sass

@@ -1,5 +1,3 @@
-@import "shared"
-
 %checkbox-radio
   cursor: pointer
   display: inline-block

sass/form/file.sass

@@ -1,5 +1,3 @@
-@import "shared"
-
 $file-border-color: $border !default
 $file-radius: $radius !default
 

sass/form/input-textarea.sass

@@ -1,5 +1,3 @@
-@import "shared"
-
 $textarea-padding: $control-padding-horizontal !default
 $textarea-max-height: 40em !default
 $textarea-min-height: 8em !default

sass/form/select.sass

@@ -1,5 +1,3 @@
-@import "shared"
-
 $select-colors: $form-colors !default
 
 .select

sass/form/tools.sass

@@ -1,5 +1,3 @@
-@import "shared"
-
 $label-color: $text-strong !default
 $label-weight: $weight-bold !default
 

sass/grid/_all.sass

@@ -1,5 +1,5 @@
 /* Bulma Grid */
 @charset "utf-8"
 
-@import "columns.sass"
-@import "tiles.sass"
+@import "columns"
+@import "tiles"

sass/helpers/_all.sass

@@ -1,12 +1,12 @@
 /* Bulma Helpers */
 @charset "utf-8"
 
-@import "color.sass"
-@import "flexbox.sass"
-@import "float.sass"
-@import "other.sass"
-@import "overflow.sass"
-@import "position.sass"
-@import "spacing.sass"
-@import "typography.sass"
-@import "visibility.sass"
+@import "color"
+@import "flexbox"
+@import "float"
+@import "other"
+@import "overflow"
+@import "position"
+@import "spacing"
+@import "typography"
+@import "visibility"

sass/layout/_all.sass

@@ -1,6 +1,6 @@
 /* Bulma Layout */
 @charset "utf-8"
 
-@import "hero.sass"
-@import "section.sass"
-@import "footer.sass"
+@import "hero"
+@import "section"
+@import "footer"

sass/utilities/_all.sass

@@ -1,8 +1,9 @@
 /* Bulma Utilities */
 @charset "utf-8"
 
-@import "initial-variables.sass"
-@import "functions.sass"
-@import "derived-variables.sass"
-@import "mixins.sass"
-@import "controls.sass"
+@import "initial-variables"
+@import "functions"
+@import "derived-variables"
+@import "mixins"
+@import "controls"
+@import "extends"

sass/utilities/controls.sass

@@ -1,4 +1,4 @@
-@import "derived-variables.sass"
+@import "derived-variables"
 
 $control-radius: $radius !default
 $control-radius-small: $radius-small !default
@@ -39,9 +39,6 @@ $control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default
   fieldset[disabled] &
     cursor: not-allowed
 
-%control
-  +control
-
 // The controls sizes use mixins so they can be used at different breakpoints
 =control-small
   border-radius: $control-radius-small

sass/utilities/derived-variables.sass

@@ -1,5 +1,5 @@
-@import "initial-variables.sass"
-@import "functions.sass"
+@import "initial-variables"
+@import "functions"
 
 $primary: $turquoise !default
 

sass/utilities/extends.sass

@@ -0,0 +1,22 @@
+@import "mixins"
+
+%control
+  +control
+
+%unselectable
+  +unselectable
+
+%arrow
+  +arrow
+
+%block
+  +block
+
+%delete
+  +delete
+
+%loader
+  +loader
+
+%overlay
+  +overlay

sass/utilities/mixins.sass

@@ -161,9 +161,6 @@
   -ms-user-select: none
   user-select: none
 
-%unselectable
-  +unselectable
-
 =arrow($color: transparent)
   border: 3px solid $color
   border-radius: 2px
@@ -180,18 +177,12 @@
   transform-origin: center
   width: 0.625em
 
-%arrow
-  +arrow
-
 =block($spacing: $block-spacing)
   &:not(:last-child)
     margin-bottom: $spacing
 
-%block
-  +block
-
 =delete
-  @extend %unselectable
+  +unselectable
   -moz-appearance: none
   -webkit-appearance: none
   background-color: bulmaRgba($scheme-invert, 0.2)
@@ -256,9 +247,6 @@
     min-width: 32px
     width: 32px
 
-%delete
-  +delete
-
 =loader
   animation: spinAround 500ms infinite linear
   border: 2px solid $grey-lighter
@@ -271,9 +259,6 @@
   position: relative
   width: 1em
 
-%loader
-  +loader
-
 =overlay($offset: 0)
   bottom: $offset
   left: $offset
@@ -281,5 +266,3 @@
   right: $offset
   top: $offset
 
-%overlay
-  +overlay