Upgrade assets to v0.0.28 (#5)

joshuajansen · May 31, 2016 · a1d145f · a1d145f
1 parent f41aa4a
commit a1d145f
Show file tree

Hide file tree

Showing 12 changed files with 80 additions and 40 deletions.
diff --git a/README.md b/README.md
@@ -8,7 +8,7 @@ A modern CSS framework based on Flexbox.
 
 Add this line to your application's Gemfile:
 
-    gem "bulma-rails", "~> 0.0.26"
+    gem "bulma-rails", "~> 0.0.28"
 
 And then execute:
 

diff --git a/app/assets/stylesheets/sass/components/grid.sass b/app/assets/stylesheets/sass/components/grid.sass
@@ -162,6 +162,43 @@
         width: ($i / 12) * 100%
       &.is-offset-#{$i}-desktop
         margin-left: ($i / 12) * 100%
+  +widescreen
+    &.is-narrow-widescreen
+      flex: none
+    &.is-full-widescreen
+      flex: none
+      width: 100%
+    &.is-three-quarters-widescreen
+      flex: none
+      width: 75%
+    &.is-two-thirds-widescreen
+      flex: none
+      width: 66.6666%
+    &.is-half-widescreen
+      flex: none
+      width: 50%
+    &.is-one-third-widescreen
+      flex: none
+      width: 33.3333%
+    &.is-one-quarter-widescreen
+      flex: none
+      width: 25%
+    &.is-offset-three-quarters-widescreen
+      margin-left: 75%
+    &.is-offset-two-thirds-widescreen
+      margin-left: 66.6666%
+    &.is-offset-half-widescreen
+      margin-left: 50%
+    &.is-offset-one-third-widescreen
+      margin-left: 33.3333%
+    &.is-offset-one-quarter-widescreen
+      margin-left: 25%
+    @for $i from 1 through 12
+      &.is-#{$i}-widescreen
+        flex: none
+        width: ($i / 12) * 100%
+      &.is-offset-#{$i}-widescreen
+        margin-left: ($i / 12) * 100%
 
 .columns
   margin-left: -10px

diff --git a/app/assets/stylesheets/sass/components/media.sass b/app/assets/stylesheets/sass/components/media.sass
@@ -35,15 +35,10 @@
     border-top: 1px solid rgba($border, 0.5)
     display: flex
     padding-top: 10px
-    .textarea
-      +control-small
-    .button
-      +button-small
     .content:not(:last-child),
     .control:not(:last-child)
       margin-bottom: 5px
     .media
-      font-size: 12px
       padding-top: 5px
       & + .media
         margin-top: 5px

diff --git a/app/assets/stylesheets/sass/components/pagination.sass b/app/assets/stylesheets/sass/components/pagination.sass
@@ -4,15 +4,9 @@
   justify-content: center
   text-align: center
   a
-    @extend .button
     display: block
     min-width: 32px
     padding: 3px 8px
-    // Modifiers
-    &.is-active
-      background: $link
-      border-color: $link
-      color: $link-invert
   span
     color: $text-light
     display: block

diff --git a/app/assets/stylesheets/sass/elements/button.sass b/app/assets/stylesheets/sass/elements/button.sass
@@ -39,7 +39,9 @@
     &:last-child
       margin-left: 4px
       margin-right: -2px
-  &:hover
+  &:hover,
+  &:focus,
+  &.is-active
     color: $control-hover
   &:active
     box-shadow: inset 0 1px 2px rgba($black, 0.2)
@@ -52,7 +54,8 @@
       border-color: transparent
       color: $color-invert
       &:hover,
-      &:focus
+      &:focus,
+      &.is-active
         background: darken($color, 10%)
         border-color: transparent
         color: $color-invert
@@ -96,7 +99,7 @@
   &.is-disabled
     opacity: 0.5
   &.is-fullwidth
-    display: block
+    display: flex
     width: 100%
   &.is-loading
     color: transparent !important

diff --git a/app/assets/stylesheets/sass/elements/form.sass b/app/assets/stylesheets/sass/elements/form.sass
@@ -15,20 +15,11 @@
   // 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%
@@ -98,6 +89,21 @@
   &: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
@@ -140,6 +146,7 @@
     .select
       border-radius: 0
       margin-right: -1px
+      width: auto
       &:hover
         z-index: 2
       &:active,
@@ -153,10 +160,17 @@
         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)
@@ -214,13 +228,12 @@
   &.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

diff --git a/app/assets/stylesheets/sass/elements/image.sass b/app/assets/stylesheets/sass/elements/image.sass
@@ -5,6 +5,8 @@ $dimensions: 16 24 32 48 64 96 128
   position: relative
   img
     display: block
+    height: auto
+    width: 100%
   // Ratio
   &.is-square,
   &.is-1by1,

diff --git a/app/assets/stylesheets/sass/elements/table.sass b/app/assets/stylesheets/sass/elements/table.sass
@@ -84,8 +84,8 @@
     tbody
       tr
         &:hover
-          background: darken($background, 5%)
+          background: darken($background, 2%)
         &:nth-child(2n)
           background: $background
           &:hover
-            background: darken($background, 5%)
+            background: darken($background, 2%)
diff --git a/app/assets/stylesheets/sass/layout/hero.sass b/app/assets/stylesheets/sass/layout/hero.sass
@@ -143,8 +143,4 @@
       align-items: center
       display: flex
       & > .container
-        align-items: stretch
-        display: flex
         flex: 1
-        flex-direction: column
-        justify-content: center
diff --git a/app/assets/stylesheets/sass/layout/section.sass b/app/assets/stylesheets/sass/layout/section.sass
@@ -3,9 +3,8 @@
   padding: 40px 20px
   // Responsiveness
   +desktop
-    padding: 40px 0
     // Sizes
     &.is-medium
-      padding: 120px 0
+      padding: 120px 20px
     &.is-large
-      padding: 240px 0
+      padding: 240px 20px
diff --git a/app/assets/stylesheets/sass/utilities/controls.sass b/app/assets/stylesheets/sass/utilities/controls.sass
@@ -18,7 +18,8 @@
   &:hover
     border-color: $control-hover-border
   &:active,
-  &:focus
+  &:focus,
+  &.is-active
     border-color: $control-active-border
     outline: none
   &[disabled],

diff --git a/bulma-rails.gemspec b/bulma-rails.gemspec
@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |gem|
   gem.name          = 'bulma-rails'
-  gem.version       = '0.0.26'
+  gem.version       = '0.0.28'
   gem.date          = Date.today
   gem.authors       = ["Joshua Jansen"]
   gem.email         = ["[email protected]"]