bulma-sass 0.6.0 → 0.6.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: fe9833c39d49e784f7408664ea5ca14815838641
-  data.tar.gz: f4fd6749013f4780ff7900c1667c9968c5e83772
+  metadata.gz: 60c061dad8b1739060e906b8de651d08f7966c72
+  data.tar.gz: 0e7066949f8186ccbd78ed48994120d595cdf1fe
 SHA512:
-  metadata.gz: 2e7b50b932c9efcc07300fb76a2f88c7d468e829f156eb8e7c35e553fd453a047d6aef9a6f4de9217c2e02a374a0f84c3c7b99fb41b5c751b44dfc48599857cb
-  data.tar.gz: ae8a600fbb8d17f7f9ee829430a4e798f22c7649e4a7c93b74d97eb675f1b2e52ab9eb9fecf370e869ea7636a74a7b18d6a047bb247ed2c3f391029852b7a87e
+  metadata.gz: 546496e3cdf267ced595843f7eb92abacb3458041c2e42dde3ecd95a2731b72035259f12db73eedbf7dacbb08c13681f5ee3620357851d8288a212ef8bdf041e
+  data.tar.gz: 71707aa3fda3978e4a6ffc0163727c60a68b22cb7d3f8a72aa5ae9ce03c5d24fdecc7f7c9961e14cfd58db33fe5ae00706dfcd6b88139e2e02d059d6fd1099d8

data/app/assets/stylesheets/sass/base/generic.sass

@@ -1,4 +1,4 @@
-$body-background-color: #fff !default
+$body-background-color: $white !default
 $body-size: 16px !default
 $body-rendering: optimizeLegibility !default
 $body-family: $family-primary !default

data/app/assets/stylesheets/sass/base/helpers.sass

@@ -89,6 +89,9 @@ $alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'rig
 .is-uppercase
   text-transform: uppercase !important
 
+.is-italic
+  font-style: italic !important
+
 @each $name, $pair in $colors
   $color: nth($pair, 1)
   .has-text-#{$name}
@@ -185,6 +188,45 @@ $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
   .is-hidden-fullhd
     display: none !important
 
+.is-invisible
+  visibility: hidden !important
+
++mobile
+  .is-invisible-mobile
+    visibility: hidden !important
+
++tablet
+  .is-invisible-tablet
+    visibility: hidden !important
+
++tablet-only
+  .is-invisible-tablet-only
+    visibility: hidden !important
+
++touch
+  .is-invisible-touch
+    visibility: hidden !important
+
++desktop
+  .is-invisible-desktop
+    visibility: hidden !important
+
++desktop-only
+  .is-invisible-desktop-only
+    visibility: hidden !important
+
++widescreen
+  .is-invisible-widescreen
+    visibility: hidden !important
+
++widescreen-only
+  .is-invisible-widescreen-only
+    visibility: hidden !important
+
++fullhd
+  .is-invisible-fullhd
+    visibility: hidden !important
+
 // Other
 
 .is-marginless

data/app/assets/stylesheets/sass/components/level.sass

@@ -42,7 +42,7 @@
   +mobile
     &:not(:last-child)
       margin-bottom: 0.75rem
-    
+
 .level-left,
 .level-right
   flex-basis: auto

data/app/assets/stylesheets/sass/components/media.sass

@@ -41,4 +41,5 @@
   flex-basis: auto
   flex-grow: 1
   flex-shrink: 1
+  overflow: auto
   text-align: left

data/app/assets/stylesheets/sass/components/modal.sass

@@ -1,4 +1,4 @@
-$modal-z: 20 !default
+$modal-z: 40 !default
 
 $modal-background-background-color: rgba($black, 0.86) !default
 

data/app/assets/stylesheets/sass/components/navbar.sass

@@ -1,8 +1,9 @@
 $navbar-background-color: $white !default
 $navbar-height: 3.25rem !default
+$navbar-fixed-z: 30 !default
 
 $navbar-item-color: $grey-dark !default
-$navbar-item-hover-color: $black !default
+$navbar-item-hover-color: $link !default
 $navbar-item-hover-background-color: $background !default
 $navbar-item-active-color: $black !default
 $navbar-item-active-background-color: transparent !default
@@ -33,6 +34,17 @@ $navbar-dropdown-item-active-background-color: $background !default
 
 $navbar-divider-background-color: $border !default
 
+=navbar-fixed
+  left: 0
+  position: fixed
+  right: 0
+  z-index: $navbar-fixed-z
+
+=navbar-fixed-html
+  left: 0
+  position: fixed
+  right: 0
+
 .navbar
   background-color: $navbar-background-color
   min-height: $navbar-height
@@ -87,6 +99,21 @@ $navbar-divider-background-color: $border !default
     width: 100%
   &.has-shadow
     box-shadow: 0 2px 3px rgba($black, 0.1)
+  &.is-fixed-bottom,
+  &.is-fixed-top
+    +navbar-fixed
+  &.is-fixed-bottom
+    bottom: 0
+    &.has-shadow
+      box-shadow: 0 -2px 3px rgba($black, 0.1)
+  &.is-fixed-top
+    top: 0
+
+html.has-navbar-fixed-top
+  padding-top: $navbar-height
+
+html.has-navbar-fixed-bottom
+  padding-bottom: $navbar-height
 
 .navbar-brand,
 .navbar-tabs
@@ -117,7 +144,7 @@ $navbar-divider-background-color: $border !default
   position: relative
 
 a.navbar-item,
-.navbar-link
+a.navbar-link
   &:hover,
   &.is-active
     background-color: $navbar-item-hover-background-color
@@ -130,6 +157,9 @@ a.navbar-item,
     max-height: $navbar-item-img-max-height
   &.has-dropdown
     padding: 0
+  &.is-expanded
+    flex-grow: 1
+    flex-shrink: 1
   &.is-tab
     border-bottom: 1px solid transparent
     min-height: $navbar-height
@@ -176,11 +206,32 @@ a.navbar-item,
       align-items: center
       display: flex
   .navbar-menu
-    background-color: $white
+    background-color: $navbar-background-color
     box-shadow: 0 8px 16px rgba($black, 0.1)
     padding: 0.5rem 0
     &.is-active
       display: block
+  // Fixed navbar
+  .navbar
+    &.is-fixed-bottom-touch,
+    &.is-fixed-top-touch
+      +navbar-fixed
+    &.is-fixed-bottom-touch
+      bottom: 0
+      &.has-shadow
+        box-shadow: 0 -2px 3px rgba($black, 0.1)
+    &.is-fixed-top-touch
+      top: 0
+    &.is-fixed-top,
+    &.is-fixed-top-touch
+      .navbar-menu
+        +overflow-touch
+        max-height: calc(100vh - #{$navbar-height})
+        overflow: auto
+  html.has-navbar-fixed-top-touch
+    padding-top: $navbar-height
+  html.has-navbar-fixed-bottom-touch
+    padding-bottom: $navbar-height
 
 +desktop
   .navbar,
@@ -193,7 +244,7 @@ a.navbar-item,
     min-height: $navbar-height
     &.is-transparent
       a.navbar-item,
-      .navbar-link
+      a.navbar-link
         &:hover,
         &.is-active
           background-color: transparent !important
@@ -219,6 +270,16 @@ a.navbar-item,
   .navbar-item
     &.has-dropdown
       align-items: stretch
+    &.has-dropdown-up
+      .navbar-link::after
+        transform: rotate(135deg) translate(0.25em, -0.25em)
+      .navbar-dropdown
+        border-bottom: $navbar-dropdown-border-top
+        border-radius: $navbar-dropdown-radius $navbar-dropdown-radius 0 0
+        border-top: none
+        bottom: 100%
+        box-shadow: 0 -8px 8px rgba($black, 0.1)
+        top: auto
     &.is-active,
     &.is-hoverable:hover
       .navbar-dropdown
@@ -282,14 +343,30 @@ a.navbar-item,
       right: 0
   .navbar-divider
     display: block
+  .navbar > .container,
   .container > .navbar
     .navbar-brand
       margin-left: -1rem
     .navbar-menu
       margin-right: -1rem
+  // Fixed navbar
+  .navbar
+    &.is-fixed-bottom-desktop,
+    &.is-fixed-top-desktop
+      +navbar-fixed
+    &.is-fixed-bottom-desktop
+      bottom: 0
+      &.has-shadow
+        box-shadow: 0 -2px 3px rgba($black, 0.1)
+    &.is-fixed-top-desktop
+      top: 0
+  html.has-navbar-fixed-top-desktop
+    padding-top: $navbar-height
+  html.has-navbar-fixed-bottom-desktop
+    padding-bottom: $navbar-height
   // Hover/Active states
   a.navbar-item,
-  .navbar-link
+  a.navbar-link
     &.is-active
       color: $navbar-item-active-color
     &.is-active:not(:hover)

data/app/assets/stylesheets/sass/components/pagination.sass

@@ -33,6 +33,14 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($black, 0.2)
     font-size: $size-medium
   &.is-large
     font-size: $size-large
+  &.is-rounded
+    .pagination-previous,
+    .pagination-next
+      padding-left: 1em
+      padding-right: 1em
+      border-radius: $radius-rounded
+    .pagination-link
+      border-radius: $radius-rounded
 
 .pagination,
 .pagination-list
@@ -58,6 +66,7 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($black, 0.2)
 .pagination-next,
 .pagination-link
   border-color: $pagination-border-color
+  color: $pagination-color
   min-width: 2.25em
   &:hover
     border-color: $pagination-hover-border-color

data/app/assets/stylesheets/sass/components/tabs.sass

@@ -132,6 +132,16 @@ $tabs-toggle-link-active-color: $link-invert !default
           z-index: 1
     ul
       border-bottom: none
+    &.is-toggle-rounded
+      li
+        &:first-child a
+          border-bottom-left-radius: $radius-rounded
+          border-top-left-radius: $radius-rounded
+          padding-left: 1.25em
+        &:last-child a
+          border-bottom-right-radius: $radius-rounded
+          border-top-right-radius: $radius-rounded
+          padding-right: 1.25em
   // Sizes
   &.is-small
     font-size: $size-small

data/app/assets/stylesheets/sass/elements/button.sass

@@ -199,3 +199,47 @@ $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
+  display: flex
+  flex-wrap: wrap
+  justify-content: flex-start
+  .button
+    margin-bottom: 0.5rem
+    &:not(:last-child)
+      margin-right: 0.5rem
+  &:last-child
+    margin-bottom: -0.5rem
+  &:not(:last-child)
+    margin-bottom: 1rem
+  &.has-addons
+    .button
+      &:not(:first-child)
+        border-bottom-left-radius: 0
+        border-top-left-radius: 0
+      &:not(:last-child)
+        border-bottom-right-radius: 0
+        border-top-right-radius: 0
+        margin-right: -1px
+      &:last-child
+        margin-right: 0
+      &:hover,
+      &.is-hovered
+        z-index: 2
+      &:focus,
+      &.is-focused,
+      &:active,
+      &.is-active,
+      &.is-selected
+        z-index: 3
+        &:hover
+          z-index: 4
+  &.is-centered
+    justify-content: center
+  &.is-right
+    justify-content: flex-end

data/app/assets/stylesheets/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
@@ -100,6 +98,10 @@ $help-size: $size-small !default
     width: auto
 
 .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
@@ -269,10 +275,11 @@ $help-size: $size-small !default
     .file-name
       border-bottom-left-radius: 0
       border-top-left-radius: 0
-  &.is-centered
-    justify-content: center
-  &.is-right
-    justify-content: flex-end
+    &.is-empty
+      .file-cta
+        border-radius: $file-radius
+      .file-name
+        display: none
   &.is-boxed
     .file-label
       flex-direction: column
@@ -302,19 +309,22 @@ $help-size: $size-small !default
       .file-name
         border-radius: 0 0 $file-radius $file-radius
         border-width: 0 1px 1px
+  &.is-centered
+    justify-content: center
+  &.is-fullwidth
+    .file-label
+      width: 100%
+    .file-name
+      flex-grow: 1
+      max-width: none
   &.is-right
+    justify-content: flex-end
     .file-cta
       border-radius: 0 $file-radius $file-radius 0
     .file-name
       border-radius: $file-radius 0 0 $file-radius
       border-width: 1px 0 1px 1px
       order: -1
-  &.is-fullwidth
-    .file-label
-      width: 100%
-    .file-name
-      flex-grow: 1
-      max-width: none
 
 .file-label
   align-items: stretch
@@ -414,22 +424,26 @@ $help-size: $size-small !default
     .control
       &:not(:last-child)
         margin-right: -1px
+      &:not(:first-child):not(:last-child)
+        .button,
+        .input,
+        .select select
+          border-radius: 0
       &:first-child
         .button,
         .input,
         .select select
-          border-bottom-left-radius: $input-radius
-          border-top-left-radius: $input-radius
+          border-bottom-right-radius: 0
+          border-top-right-radius: 0
       &:last-child
         .button,
         .input,
         .select select
-          border-bottom-right-radius: $input-radius
-          border-top-right-radius: $input-radius
+          border-bottom-left-radius: 0
+          border-top-left-radius: 0
       .button,
       .input,
       .select select
-        border-radius: 0
         &:hover,
         &.is-hovered
           z-index: 2
@@ -597,6 +611,7 @@ $help-size: $size-small !default
       position: absolute !important
       right: 0.625em
       top: 0.625em
+      z-index: 4
     &.is-small:after
       font-size: $size-small
     &.is-medium:after

data/app/assets/stylesheets/sass/elements/image.sass

@@ -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,

data/app/assets/stylesheets/sass/elements/notification.sass

@@ -20,8 +20,8 @@ $notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default
     background: transparent
   & > .delete
     position: absolute
-    right: 0.5em
-    top: 0.5em
+    right: 0.5rem
+    top: 0.5rem
   .title,
   .subtitle,
   .content

data/app/assets/stylesheets/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

data/app/assets/stylesheets/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
@@ -18,6 +18,9 @@ $progress-value-background-color: $text !default
     background-color: $progress-value-background-color
   &::-moz-progress-bar
     background-color: $progress-value-background-color
+  &::-ms-fill
+    background-color: $progress-value-background-color
+    border: none
   // Colors
   @each $name, $pair in $colors
     $color: nth($pair, 1)
@@ -26,6 +29,8 @@ $progress-value-background-color: $text !default
         background-color: $color
       &::-moz-progress-bar
         background-color: $color
+      &::-ms-fill
+        background-color: $color
   // Sizes
   &.is-small
     height: $size-small

data/app/assets/stylesheets/sass/elements/table.sass

@@ -41,6 +41,12 @@ $table-striped-row-even-hover-background-color: $white-ter !default
     &.is-narrow
       white-space: nowrap
       width: 1%
+    &.is-selected
+      background-color: $table-row-active-background-color
+      color: $table-row-active-color
+      a,
+      strong
+        color: currentColor
   th
     color: $table-cell-heading-color
     text-align: left
@@ -85,7 +91,7 @@ $table-striped-row-even-hover-background-color: $white-ter !default
     width: 100%
   &.is-hoverable
     tbody
-      tr
+      tr:not(.is-selected)
         &:hover
           background-color: $table-row-hover-background-color
     &.is-striped

data/app/assets/stylesheets/sass/elements/tag.sass

@@ -25,6 +25,18 @@ $tag-delete-margin: 1px !default
       &:not(:last-child)
         border-bottom-right-radius: 0
         border-top-right-radius: 0
+  &.is-centered
+    justify-content: center
+    .tag
+      margin-right: 0.25rem
+      margin-left: 0.25rem
+  &.is-right
+    justify-content: flex-end
+    .tag
+      &:not(:first-child)
+        margin-left: 0.5rem
+      &:not(:last-child)
+        margin-right: 0
 
 .tag:not(body)
   align-items: center
@@ -54,6 +66,16 @@ $tag-delete-margin: 1px !default
     font-size: $size-normal
   &.is-large
     font-size: $size-medium
+  .icon
+    &:first-child:not(:last-child)
+      margin-left: -0.375em
+      margin-right: 0.1875em
+    &:last-child:not(:first-child)
+      margin-left: 0.1875em
+      margin-right: -0.375em
+    &:first-child:last-child
+      margin-left: -0.375em
+      margin-right: -0.375em
   // Modifiers
   &.is-delete
     margin-left: $tag-delete-margin
@@ -82,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

data/app/assets/stylesheets/sass/elements/title.sass

@@ -3,6 +3,8 @@ $title-size: $size-3 !default
 $title-weight: $weight-semibold !default
 $title-strong-color: inherit !default
 $title-strong-weight: inherit !default
+$title-sub-size: 0.75em !default
+$title-sup-size: 0.75em !default
 
 $subtitle-color: $grey-dark !default
 $subtitle-size: $size-5 !default
@@ -17,6 +19,10 @@ $subtitle-strong-weight: $weight-semibold !default
   em,
   span
     font-weight: inherit
+  sub
+    font-size: $title-sub-size
+  sup
+    font-size: $title-sup-size
   .tag
     vertical-align: middle
 

data/app/assets/stylesheets/sass/grid/columns.sass

@@ -26,6 +26,18 @@ $column-gap: 0.75rem !default
   .columns.is-mobile > &.is-one-quarter
     flex: none
     width: 25%
+  .columns.is-mobile > &.is-one-fifth
+    flex: none
+    width: 20%
+  .columns.is-mobile > &.is-two-fifths
+    flex: none
+    width: 40%
+  .columns.is-mobile > &.is-three-fifths
+    flex: none
+    width: 60%
+  .columns.is-mobile > &.is-four-fifths
+    flex: none
+    width: 80%
   .columns.is-mobile > &.is-offset-three-quarters
     margin-left: 75%
   .columns.is-mobile > &.is-offset-two-thirds
@@ -36,6 +48,14 @@ $column-gap: 0.75rem !default
     margin-left: 33.3333%
   .columns.is-mobile > &.is-offset-one-quarter
     margin-left: 25%
+  .columns.is-mobile > &.is-offset-one-fifth
+    margin-left: 20%
+  .columns.is-mobile > &.is-offset-two-fifths
+    margin-left: 40%
+  .columns.is-mobile > &.is-offset-three-fifths
+    margin-left: 60%
+  .columns.is-mobile > &.is-offset-four-fifths
+    margin-left: 80%
   @for $i from 1 through 12
     .columns.is-mobile > &.is-#{$i}
       flex: none
@@ -63,6 +83,18 @@ $column-gap: 0.75rem !default
     &.is-one-quarter-mobile
       flex: none
       width: 25%
+    &.is-one-fifth-mobile
+      flex: none
+      width: 20%
+    &.is-two-fifths-mobile
+      flex: none
+      width: 40%
+    &.is-three-fifths-mobile
+      flex: none
+      width: 60%
+    &.is-four-fifths-mobile
+      flex: none
+      width: 80%
     &.is-offset-three-quarters-mobile
       margin-left: 75%
     &.is-offset-two-thirds-mobile
@@ -73,6 +105,14 @@ $column-gap: 0.75rem !default
       margin-left: 33.3333%
     &.is-offset-one-quarter-mobile
       margin-left: 25%
+    &.is-offset-one-fifth-mobile
+      margin-left: 20%
+    &.is-offset-two-fifths-mobile
+      margin-left: 40%
+    &.is-offset-three-fifths-mobile
+      margin-left: 60%
+    &.is-offset-four-fifths-mobile
+      margin-left: 80%
     @for $i from 1 through 12
       &.is-#{$i}-mobile
         flex: none
@@ -107,6 +147,22 @@ $column-gap: 0.75rem !default
     &.is-one-quarter-tablet
       flex: none
       width: 25%
+    &.is-one-fifth,
+    &.is-one-fifth-tablet
+      flex: none
+      width: 20%
+    &.is-two-fifths,
+    &.is-two-fifths-tablet
+      flex: none
+      width: 40%
+    &.is-three-fifths,
+    &.is-three-fifths-tablet
+      flex: none
+      width: 60%
+    &.is-four-fifths,
+    &.is-four-fifths-tablet
+      flex: none
+      width: 80%
     &.is-offset-three-quarters,
     &.is-offset-three-quarters-tablet
       margin-left: 75%
@@ -122,6 +178,18 @@ $column-gap: 0.75rem !default
     &.is-offset-one-quarter,
     &.is-offset-one-quarter-tablet
       margin-left: 25%
+    &.is-offset-one-fifth,
+    &.is-offset-one-fifth-tablet
+      margin-left: 20%
+    &.is-offset-two-fifths,
+    &.is-offset-two-fifths-tablet
+      margin-left: 40%
+    &.is-offset-three-fifths,
+    &.is-offset-three-fifths-tablet
+      margin-left: 60%
+    &.is-offset-four-fifths,
+    &.is-offset-four-fifths-tablet
+      margin-left: 80%
     @for $i from 1 through 12
       &.is-#{$i},
       &.is-#{$i}-tablet
@@ -151,6 +219,18 @@ $column-gap: 0.75rem !default
     &.is-one-quarter-touch
       flex: none
       width: 25%
+    &.is-one-fifth-touch
+      flex: none
+      width: 20%
+    &.is-two-fifths-touch
+      flex: none
+      width: 40%
+    &.is-three-fifths-touch
+      flex: none
+      width: 60%
+    &.is-four-fifths-touch
+      flex: none
+      width: 80%
     &.is-offset-three-quarters-touch
       margin-left: 75%
     &.is-offset-two-thirds-touch
@@ -161,6 +241,14 @@ $column-gap: 0.75rem !default
       margin-left: 33.3333%
     &.is-offset-one-quarter-touch
       margin-left: 25%
+    &.is-offset-one-fifth-touch
+      margin-left: 20%
+    &.is-offset-two-fifths-touch
+      margin-left: 40%
+    &.is-offset-three-fifths-touch
+      margin-left: 60%
+    &.is-offset-four-fifths-touch
+      margin-left: 80%
     @for $i from 1 through 12
       &.is-#{$i}-touch
         flex: none
@@ -188,6 +276,18 @@ $column-gap: 0.75rem !default
     &.is-one-quarter-desktop
       flex: none
       width: 25%
+    &.is-one-fifth-desktop
+      flex: none
+      width: 20%
+    &.is-two-fifths-desktop
+      flex: none
+      width: 40%
+    &.is-three-fifths-desktop
+      flex: none
+      width: 60%
+    &.is-four-fifths-desktop
+      flex: none
+      width: 80%
     &.is-offset-three-quarters-desktop
       margin-left: 75%
     &.is-offset-two-thirds-desktop
@@ -198,6 +298,14 @@ $column-gap: 0.75rem !default
       margin-left: 33.3333%
     &.is-offset-one-quarter-desktop
       margin-left: 25%
+    &.is-offset-one-fifth-desktop
+      margin-left: 20%
+    &.is-offset-two-fifths-desktop
+      margin-left: 40%
+    &.is-offset-three-fifths-desktop
+      margin-left: 60%
+    &.is-offset-four-fifths-desktop
+      margin-left: 80%
     @for $i from 1 through 12
       &.is-#{$i}-desktop
         flex: none
@@ -225,6 +333,18 @@ $column-gap: 0.75rem !default
     &.is-one-quarter-widescreen
       flex: none
       width: 25%
+    &.is-one-fifth-widescreen
+      flex: none
+      width: 20%
+    &.is-two-fifths-widescreen
+      flex: none
+      width: 40%
+    &.is-three-fifths-widescreen
+      flex: none
+      width: 60%
+    &.is-four-fifths-widescreen
+      flex: none
+      width: 80%
     &.is-offset-three-quarters-widescreen
       margin-left: 75%
     &.is-offset-two-thirds-widescreen
@@ -235,6 +355,14 @@ $column-gap: 0.75rem !default
       margin-left: 33.3333%
     &.is-offset-one-quarter-widescreen
       margin-left: 25%
+    &.is-offset-one-fifth-widescreen
+      margin-left: 20%
+    &.is-offset-two-fifths-widescreen
+      margin-left: 40%
+    &.is-offset-three-fifths-widescreen
+      margin-left: 60%
+    &.is-offset-four-fifths-widescreen
+      margin-left: 80%
     @for $i from 1 through 12
       &.is-#{$i}-widescreen
         flex: none
@@ -262,6 +390,18 @@ $column-gap: 0.75rem !default
     &.is-one-quarter-fullhd
       flex: none
       width: 25%
+    &.is-one-fifth-fullhd
+      flex: none
+      width: 20%
+    &.is-two-fifths-fullhd
+      flex: none
+      width: 40%
+    &.is-three-fifths-fullhd
+      flex: none
+      width: 60%
+    &.is-four-fifths-fullhd
+      flex: none
+      width: 80%
     &.is-offset-three-quarters-fullhd
       margin-left: 75%
     &.is-offset-two-thirds-fullhd
@@ -272,6 +412,14 @@ $column-gap: 0.75rem !default
       margin-left: 33.3333%
     &.is-offset-one-quarter-fullhd
       margin-left: 25%
+    &.is-offset-one-fifth-fullhd
+      margin-left: 20%
+    &.is-offset-two-fifths-fullhd
+      margin-left: 40%
+    &.is-offset-three-fifths-fullhd
+      margin-left: 60%
+    &.is-offset-four-fifths-fullhd
+      margin-left: 80%
     @for $i from 1 through 12
       &.is-#{$i}-fullhd
         flex: none
@@ -316,13 +464,14 @@ $column-gap: 0.75rem !default
     &.is-desktop
       display: flex
 
-.columns.is-variable
-  --columnGap: 0.75rem
-  margin-left: calc(-1 * var(--columnGap))
-  margin-right: calc(-1 * var(--columnGap))
-  .column
-    padding-left: var(--columnGap)
-    padding-right: var(--columnGap)
-  @for $i from 0 through 8
-    &.is-#{$i}
-      --columnGap: $i * 0.25rem
+@if $variable-columns
+  .columns.is-variable
+    --columnGap: 0.75rem
+    margin-left: calc(-1 * var(--columnGap))
+    margin-right: calc(-1 * var(--columnGap))
+    .column
+      padding-left: var(--columnGap)
+      padding-right: var(--columnGap)
+    @for $i from 0 through 8
+      &.is-#{$i}
+        --columnGap: #{$i * 0.25rem}

data/app/assets/stylesheets/sass/layout/hero.sass

@@ -17,7 +17,7 @@
     &.is-#{$name}
       background-color: $color
       color: $color-invert
-      a:not(.button),
+      a:not(.button):not(.dropdown-item):not(.tag),
       strong
         color: inherit
       .title

data/app/assets/stylesheets/sass/utilities/initial-variables.sass

@@ -49,12 +49,12 @@ $weight-bold: 700 !default
 $gap: 32px !default
 // 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
 $tablet: 769px !default
-// 960px container + 3rem
+// 960px container + 4rem
 $desktop: 960px + (2 * $gap) !default
-// 1152px container + 3rem
-$widescreen: 1152px + (2 * $gap)  !default
-// 1344px container + 3rem
-$fullhd: 1344px + (2 * $gap)  !default
+// 1152px container + 4rem
+$widescreen: 1152px + (2 * $gap) !default
+// 1344px container + 4rem
+$fullhd: 1344px + (2 * $gap) !default
 
 // Miscellaneous
 
@@ -62,4 +62,9 @@ $easing: ease-out !default
 $radius-small: 2px !default
 $radius: 3px !default
 $radius-large: 5px !default
+$radius-rounded: 290486px !default
 $speed: 86ms !default
+
+// Flags
+
+$variable-columns: true !default

data/app/assets/stylesheets/sass/utilities/mixins.sass

@@ -10,6 +10,7 @@
   pointer-events: none
   position: absolute
   transform: rotate(-45deg)
+  transform-origin: center
   width: 0.5em
 
 =block
@@ -37,12 +38,12 @@
   -webkit-appearance: none
   background-color: rgba($black, 0.2)
   border: none
-  border-radius: 290486px
+  border-radius: $radius-rounded
   cursor: pointer
   display: inline-block
   flex-grow: 0
   flex-shrink: 0
-  font-size: $size-normal
+  font-size: 0
   height: 20px
   max-height: 20px
   max-width: 20px
@@ -115,39 +116,35 @@
     background-color: currentColor
     display: block
     height: 1px
-    left: 50%
-    margin-left: -7px
+    left: calc(50% - 8px)
     position: absolute
-    top: 50%
-    transition: none $speed $easing
-    transition-property: background, left, opacity, transform
-    width: 15px
+    transform-origin: center
+    transition-duration: $speed
+    transition-property: background-color, opacity, transform
+    transition-timing-function: $easing
+    width: 16px
     &:nth-child(1)
-      margin-top: -6px
+      top: calc(50% - 6px)
     &:nth-child(2)
-      margin-top: -1px
+      top: calc(50% - 1px)
     &:nth-child(3)
-      margin-top: 4px
+      top: calc(50% + 4px)
   &:hover
     background-color: rgba(black, 0.05)
   // Modifers
   &.is-active
     span
       &:nth-child(1)
-        margin-left: -5px
-        transform: rotate(45deg)
-        transform-origin: left top
+        transform: translateY(5px) rotate(45deg)
       &:nth-child(2)
         opacity: 0
       &:nth-child(3)
-        margin-left: -5px
-        transform: rotate(-45deg)
-        transform-origin: left bottom
+        transform: translateY(-5px) rotate(-45deg)
 
 =loader
   animation: spinAround 500ms infinite linear
   border: 2px solid $border
-  border-radius: 290486px
+  border-radius: $radius-rounded
   border-right-color: transparent
   border-top-color: transparent
   content: ""

data/lib/bulma/sass/version.rb

@@ -1,5 +1,5 @@
 module Bulma
   module Sass
-    VERSION = "0.6.0"
+    VERSION = "0.6.2"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: bulma-sass
 version: !ruby/object:Gem::Version
-  version: 0.6.0
+  version: 0.6.2
 platform: ruby
 authors:
 - bananaappletw
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2017-11-03 00:00:00.000000000 Z
+date: 2018-01-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass