bulma-rails 0.5.3 → 0.6.0

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: a8871a869d0f25ff4d8e940a11dff8bff11eb3be
4
- data.tar.gz: 10b9f9d1596bb8363ed3d8bbedcac49cd03beaec
3
+ metadata.gz: d27e1586857f0c0974dd06625e8696ededf9fd71
4
+ data.tar.gz: 83044c809b9ea7ab8f45c762ffbcad7fdf136999
5
5
  SHA512:
6
- metadata.gz: 2032ee03a7705799753ff40645fa994208f7d0513d84a5f5804a94d1cfd0fec0bab88f62af483e7694a7ac9bb88f0b6012c8e2429f52d0afc5738475c0d60278
7
- data.tar.gz: 52a5eb800d3c0f97b313f25037d3b2d306fb50c6d1504c8eafdc4a1cfdfec7d22e479fc8584e4f1994917ec6b4c6910f0decd38b3ad3c783614ceb6d06c87cee
6
+ metadata.gz: 22418e4cb5e256c443542ad5102a9d6080ae8e0a47c0c91be240bc547e3671352ff457d4ee36f784f50d464244d5a1ae2353d80e7fc295d4401859bd06eebf9e
7
+ data.tar.gz: 9d6333a192f6a1d369bb742877b51e26e7728189d773fed6b1bd14fe7a07d2cd3b909ba8083f84e1cab3fc1d4cb426e69c11ecb9cc614a763fa5c7954eb713d5
data/README.md CHANGED
@@ -8,7 +8,7 @@ A modern CSS framework based on Flexbox.
8
8
 
9
9
  Add this line to your application's Gemfile:
10
10
 
11
- gem "bulma-rails", "~> 0.5.3"
11
+ gem "bulma-rails", "~> 0.6.0"
12
12
 
13
13
  And then execute:
14
14
 
@@ -1,5 +1,5 @@
1
1
  @charset "utf-8"
2
- /*! bulma.io v0.5.3 | MIT License | github.com/jgthms/bulma */
2
+ /*! bulma.io v0.6.0 | MIT License | github.com/jgthms/bulma */
3
3
  @import "sass/utilities/_all"
4
4
  @import "sass/base/_all"
5
5
  @import "sass/elements/_all"
@@ -8,7 +8,6 @@
8
8
  @import "menu.sass"
9
9
  @import "message.sass"
10
10
  @import "modal.sass"
11
- @import "nav.sass"
12
11
  @import "navbar.sass"
13
12
  @import "pagination.sass"
14
13
  @import "panel.sass"
@@ -1,4 +1,4 @@
1
- $breadcrumb-item-color: $text-light !default
1
+ $breadcrumb-item-color: $link !default
2
2
  $breadcrumb-item-hover-color: $link-hover !default
3
3
  $breadcrumb-item-active-color: $text-strong !default
4
4
 
@@ -8,8 +8,8 @@ $dropdown-content-z: 20 !default
8
8
  $dropdown-item-color: $grey-dark !default
9
9
  $dropdown-item-hover-color: $black !default
10
10
  $dropdown-item-hover-background-color: $background !default
11
- $dropdown-item-active-color: $primary-invert !default
12
- $dropdown-item-active-background-color: $primary !default
11
+ $dropdown-item-active-color: $link-invert !default
12
+ $dropdown-item-active-background-color: $link !default
13
13
 
14
14
  $dropdown-divider-background-color: $border !default
15
15
 
@@ -25,6 +25,12 @@ $dropdown-divider-background-color: $border !default
25
25
  .dropdown-menu
26
26
  left: auto
27
27
  right: 0
28
+ &.is-up
29
+ .dropdown-menu
30
+ bottom: 100%
31
+ padding-bottom: $dropdown-content-offset
32
+ padding-top: unset
33
+ top: auto
28
34
 
29
35
  .dropdown-menu
30
36
  display: none
@@ -20,6 +20,7 @@
20
20
  margin-bottom: 0
21
21
  &:not(.is-narrow)
22
22
  flex-grow: 1
23
+ margin-right: 0.75rem
23
24
  // Responsiveness
24
25
  +tablet
25
26
  display: flex
@@ -41,7 +42,7 @@
41
42
  +mobile
42
43
  &:not(:last-child)
43
44
  margin-bottom: 0.75rem
44
-
45
+
45
46
  .level-left,
46
47
  .level-right
47
48
  flex-basis: auto
@@ -9,10 +9,10 @@ $navbar-item-active-background-color: transparent !default
9
9
  $navbar-item-img-max-height: 1.75rem !default
10
10
 
11
11
  $navbar-tab-hover-background-color: transparent !default
12
- $navbar-tab-hover-border-bottom-color: $primary !default
13
- $navbar-tab-active-color: $primary !default
12
+ $navbar-tab-hover-border-bottom-color: $link !default
13
+ $navbar-tab-active-color: $link !default
14
14
  $navbar-tab-active-background-color: transparent !default
15
- $navbar-tab-active-border-bottom-color: $primary !default
15
+ $navbar-tab-active-border-bottom-color: $link !default
16
16
  $navbar-tab-active-border-bottom-style: solid !default
17
17
  $navbar-tab-active-border-bottom-width: 3px !default
18
18
 
@@ -28,7 +28,7 @@ $navbar-dropdown-boxed-shadow: 0 8px 8px rgba($black, 0.1), 0 0 0 1px rgba($blac
28
28
 
29
29
  $navbar-dropdown-item-hover-color: $black !default
30
30
  $navbar-dropdown-item-hover-background-color: $background !default
31
- $navbar-dropdown-item-active-color: $primary !default
31
+ $navbar-dropdown-item-active-color: $link !default
32
32
  $navbar-dropdown-item-active-background-color: $background !default
33
33
 
34
34
  $navbar-divider-background-color: $border !default
@@ -196,12 +196,12 @@ a.navbar-item,
196
196
  .navbar-link
197
197
  &:hover,
198
198
  &.is-active
199
- background-color: transparent
199
+ background-color: transparent !important
200
200
  .navbar-item.has-dropdown
201
201
  &.is-active,
202
202
  &.is-hoverable:hover
203
203
  .navbar-link
204
- background-color: transparent
204
+ background-color: transparent !important
205
205
  .navbar-dropdown
206
206
  a.navbar-item
207
207
  &:hover
@@ -4,8 +4,8 @@ $tabs-border-bottom-width: 1px !default
4
4
  $tabs-link-color: $text !default
5
5
  $tabs-link-hover-border-bottom-color: $text-strong !default
6
6
  $tabs-link-hover-color: $text-strong !default
7
- $tabs-link-active-border-bottom-color: $primary !default
8
- $tabs-link-active-color: $primary !default
7
+ $tabs-link-active-border-bottom-color: $link !default
8
+ $tabs-link-active-color: $link !default
9
9
  $tabs-link-padding: 0.5em 1em !default
10
10
 
11
11
  $tabs-boxed-link-radius: $radius !default
@@ -22,9 +22,9 @@ $tabs-toggle-link-border-width: 1px !default
22
22
  $tabs-toggle-link-hover-background-color: $background !default
23
23
  $tabs-toggle-link-hover-border-color: $border-hover !default
24
24
  $tabs-toggle-link-radius: $radius !default
25
- $tabs-toggle-link-active-background-color: $primary !default
26
- $tabs-toggle-link-active-border-color: $primary !default
27
- $tabs-toggle-link-active-color: $primary-invert !default
25
+ $tabs-toggle-link-active-background-color: $link !default
26
+ $tabs-toggle-link-active-border-color: $link !default
27
+ $tabs-toggle-link-active-color: $link-invert !default
28
28
 
29
29
  .tabs
30
30
  +block
@@ -13,9 +13,9 @@ $button-focus-box-shadow-color: rgba($link, 0.25) !default
13
13
  $button-active-color: $link-active !default
14
14
  $button-active-border-color: $link-active-border !default
15
15
 
16
- $button-link-color: $text !default
17
- $button-link-hover-background-color: $background !default
18
- $button-link-hover-color: $text-strong !default
16
+ $button-text-color: $text !default
17
+ $button-text-hover-background-color: $background !default
18
+ $button-text-hover-color: $text-strong !default
19
19
 
20
20
  $button-disabled-background-color: $white !default
21
21
  $button-disabled-border-color: $grey-lighter !default
@@ -81,21 +81,21 @@ $button-static-border-color: $grey-lighter !default
81
81
  border-color: $button-active-border-color
82
82
  color: $button-active-color
83
83
  // Colors
84
- &.is-link
84
+ &.is-text
85
85
  background-color: transparent
86
86
  border-color: transparent
87
- color: $button-link-color
87
+ color: $button-text-color
88
88
  text-decoration: underline
89
89
  &:hover,
90
90
  &.is-hovered,
91
91
  &:focus,
92
92
  &.is-focused
93
- background-color: $button-link-hover-background-color
94
- color: $button-link-hover-color
93
+ background-color: $button-text-hover-background-color
94
+ color: $button-text-hover-color
95
95
  &:active,
96
96
  &.is-active
97
- background-color: darken($button-link-hover-background-color, 5%)
98
- color: $button-link-hover-color
97
+ background-color: darken($button-text-hover-background-color, 5%)
98
+ color: $button-text-hover-color
99
99
  &[disabled]
100
100
  background-color: transparent
101
101
  border-color: transparent
@@ -45,6 +45,8 @@ $help-size: $size-small !default
45
45
  background-color: $input-background-color
46
46
  border-color: $input-border-color
47
47
  color: $input-color
48
+ +placeholder
49
+ color: rgba($input-color, 0.3)
48
50
  &:hover,
49
51
  &.is-hovered
50
52
  border-color: $input-hover-border-color
@@ -45,8 +45,6 @@ $table-striped-row-even-hover-background-color: $white-ter !default
45
45
  color: $table-cell-heading-color
46
46
  text-align: left
47
47
  tr
48
- &:hover
49
- background-color: $table-row-hover-background-color
50
48
  &.is-selected
51
49
  background-color: $table-row-active-background-color
52
50
  color: $table-row-active-color
@@ -85,6 +83,16 @@ $table-striped-row-even-hover-background-color: $white-ter !default
85
83
  border-bottom-width: 1px
86
84
  &.is-fullwidth
87
85
  width: 100%
86
+ &.is-hoverable
87
+ tbody
88
+ tr
89
+ &:hover
90
+ background-color: $table-row-hover-background-color
91
+ &.is-striped
92
+ tbody
93
+ tr:not(.is-selected)
94
+ &:hover
95
+ background-color: $table-striped-row-even-hover-background-color
88
96
  &.is-narrow
89
97
  td,
90
98
  th
@@ -94,5 +102,3 @@ $table-striped-row-even-hover-background-color: $white-ter !default
94
102
  tr:not(.is-selected)
95
103
  &:nth-child(even)
96
104
  background-color: $table-striped-row-even-background-color
97
- &:hover
98
- background-color: $table-striped-row-even-hover-background-color
@@ -5,9 +5,8 @@
5
5
  display: flex
6
6
  flex-direction: column
7
7
  justify-content: space-between
8
- .nav
8
+ .navbar
9
9
  background: none
10
- box-shadow: 0 1px 0 rgba($border, 0.3)
11
10
  .tabs
12
11
  ul
13
12
  border-bottom: none
@@ -28,16 +27,17 @@
28
27
  a:not(.button),
29
28
  strong
30
29
  color: $color-invert
31
- .nav
32
- box-shadow: 0 1px 0 rgba($color-invert, 0.2)
33
- .nav-menu
34
- +mobile
30
+ .navbar-menu
31
+ +touch
35
32
  background-color: $color
36
- a.nav-item,
37
- .nav-item a:not(.button)
33
+ .navbar-item,
34
+ .navbar-link
38
35
  color: rgba($color-invert, 0.7)
36
+ a.navbar-item,
37
+ .navbar-link
39
38
  &:hover,
40
39
  &.is-active
40
+ background-color: darken($color, 5%)
41
41
  color: $color-invert
42
42
  .tabs
43
43
  a
@@ -66,21 +66,21 @@
66
66
  $gradient-bottom-right: lighten(saturate(adjust-hue($color, 10deg), 5%), 5%)
67
67
  background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
68
68
  +mobile
69
- .nav-menu
69
+ .navbar-menu
70
70
  background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
71
71
  // Responsiveness
72
- +mobile
73
- .nav-toggle
74
- span
75
- background-color: $color-invert
76
- &:hover
77
- background-color: rgba($black, 0.1)
78
- &.is-active
79
- span
80
- background-color: $color-invert
81
- .nav-menu
82
- .nav-item
83
- border-top-color: rgba($color-invert, 0.2)
72
+ // +mobile
73
+ // .nav-toggle
74
+ // span
75
+ // background-color: $color-invert
76
+ // &:hover
77
+ // background-color: rgba($black, 0.1)
78
+ // &.is-active
79
+ // span
80
+ // background-color: $color-invert
81
+ // .nav-menu
82
+ // .nav-item
83
+ // border-top-color: rgba($color-invert, 0.2)
84
84
  // Sizes
85
85
  &.is-small
86
86
  .hero-body
@@ -1,6 +1,6 @@
1
1
  $primary: $turquoise !default
2
2
 
3
- $info: $blue !default
3
+ $info: $cyan !default
4
4
  $success: $green !default
5
5
  $warning: $yellow !default
6
6
  $danger: $red !default
@@ -14,12 +14,13 @@ $orange-invert: findColorInvert($orange) !default
14
14
  $yellow-invert: findColorInvert($yellow) !default
15
15
  $green-invert: findColorInvert($green) !default
16
16
  $turquoise-invert: findColorInvert($turquoise) !default
17
+ $cyan-invert: findColorInvert($cyan) !default
17
18
  $blue-invert: findColorInvert($blue) !default
18
19
  $purple-invert: findColorInvert($purple) !default
19
20
  $red-invert: findColorInvert($red) !default
20
21
 
21
22
  $primary-invert: $turquoise-invert !default
22
- $info-invert: $blue-invert !default
23
+ $info-invert: $cyan-invert !default
23
24
  $success-invert: $green-invert !default
24
25
  $warning-invert: $yellow-invert !default
25
26
  $danger-invert: $red-invert !default
@@ -50,15 +51,15 @@ $pre-background: $background !default
50
51
 
51
52
  // Link colors
52
53
 
53
- $link: $primary !default
54
- $link-invert: $primary-invert !default
54
+ $link: $blue !default
55
+ $link-invert: $blue-invert !default
55
56
  $link-visited: $purple !default
56
57
 
57
58
  $link-hover: $grey-darker !default
58
59
  $link-hover-border: $grey-light !default
59
60
 
60
61
  $link-focus: $grey-darker !default
61
- $link-focus-border: $primary !default
62
+ $link-focus-border: $blue !default
62
63
 
63
64
  $link-active: $grey-darker !default
64
65
  $link-active-border: $grey-dark !default
@@ -75,7 +76,7 @@ $size-large: $size-4 !default
75
76
 
76
77
  // Lists and maps
77
78
 
78
- $colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default
79
+ $colors: ("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert), "link": ($link, $link-invert), "info": ($info, $info-invert), "success": ($success, $success-invert), "warning": ($warning, $warning-invert), "danger": ($danger, $danger-invert)) !default
79
80
  $shades: ("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis) !default
80
81
 
81
82
  $sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
@@ -18,6 +18,7 @@ $orange: hsl(14, 100%, 53%) !default
18
18
  $yellow: hsl(48, 100%, 67%) !default
19
19
  $green: hsl(141, 71%, 48%) !default
20
20
  $turquoise: hsl(171, 100%, 41%) !default
21
+ $cyan: hsl(204, 86%, 53%) !default
21
22
  $blue: hsl(217, 71%, 53%) !default
22
23
  $purple: hsl(271, 100%, 71%) !default
23
24
  $red: hsl(348, 100%, 61%) !default
@@ -1,3 +1,5 @@
1
+ @import "initial-variables"
2
+
1
3
  =arrow($color)
2
4
  border: 1px solid $color
3
5
  border-right: 0
@@ -2,7 +2,7 @@
2
2
 
3
3
  Gem::Specification.new do |gem|
4
4
  gem.name = 'bulma-rails'
5
- gem.version = '0.5.3'
5
+ gem.version = '0.6.0'
6
6
  gem.authors = ["Joshua Jansen"]
7
7
  gem.email = ["joshuajansen88@gmail.com"]
8
8
  gem.description = %q{A modern CSS framework based on Flexbox}
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: bulma-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.5.3
4
+ version: 0.6.0
5
5
  platform: ruby
6
6
  authors:
7
7
  - Joshua Jansen
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2017-09-22 00:00:00.000000000 Z
11
+ date: 2017-10-25 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: sass