bulma-rails 0.7.3 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (63) hide show
  1. checksums.yaml +4 -4
  2. data/.gitignore +2 -0
  3. data/README.md +1 -1
  4. data/app/assets/stylesheets/bulma.sass +3 -1
  5. data/app/assets/stylesheets/sass/base/_all.sass +0 -1
  6. data/app/assets/stylesheets/sass/base/generic.sass +22 -10
  7. data/app/assets/stylesheets/sass/base/helpers.sass +1 -276
  8. data/app/assets/stylesheets/sass/base/minireset.sass +3 -3
  9. data/app/assets/stylesheets/sass/components/_all.sass +0 -1
  10. data/app/assets/stylesheets/sass/components/breadcrumb.sass +4 -4
  11. data/app/assets/stylesheets/sass/components/card.sass +15 -10
  12. data/app/assets/stylesheets/sass/components/dropdown.sass +15 -11
  13. data/app/assets/stylesheets/sass/components/level.sass +5 -3
  14. data/app/assets/stylesheets/sass/components/media.sass +14 -10
  15. data/app/assets/stylesheets/sass/components/menu.sass +16 -9
  16. data/app/assets/stylesheets/sass/components/message.sass +24 -11
  17. data/app/assets/stylesheets/sass/components/modal.sass +4 -4
  18. data/app/assets/stylesheets/sass/components/navbar.sass +40 -27
  19. data/app/assets/stylesheets/sass/components/pagination.sass +16 -10
  20. data/app/assets/stylesheets/sass/components/panel.sass +33 -15
  21. data/app/assets/stylesheets/sass/components/tabs.sass +36 -13
  22. data/app/assets/stylesheets/sass/elements/_all.sass +0 -1
  23. data/app/assets/stylesheets/sass/elements/box.sass +4 -4
  24. data/app/assets/stylesheets/sass/elements/button.sass +79 -31
  25. data/app/assets/stylesheets/sass/elements/container.sass +14 -15
  26. data/app/assets/stylesheets/sass/elements/content.sass +9 -5
  27. data/app/assets/stylesheets/sass/elements/form.sass +1 -602
  28. data/app/assets/stylesheets/sass/elements/image.sass +2 -0
  29. data/app/assets/stylesheets/sass/elements/notification.sass +16 -3
  30. data/app/assets/stylesheets/sass/elements/progress.sass +16 -14
  31. data/app/assets/stylesheets/sass/elements/table.sass +10 -7
  32. data/app/assets/stylesheets/sass/elements/tag.sass +31 -25
  33. data/app/assets/stylesheets/sass/elements/title.sass +9 -3
  34. data/app/assets/stylesheets/sass/form/_all.sass +8 -0
  35. data/app/assets/stylesheets/sass/form/checkbox-radio.sass +21 -0
  36. data/app/assets/stylesheets/sass/form/file.sass +180 -0
  37. data/app/assets/stylesheets/sass/form/input-textarea.sass +64 -0
  38. data/app/assets/stylesheets/sass/form/select.sass +85 -0
  39. data/app/assets/stylesheets/sass/form/shared.sass +55 -0
  40. data/app/assets/stylesheets/sass/form/tools.sass +213 -0
  41. data/app/assets/stylesheets/sass/grid/columns.sass +7 -7
  42. data/app/assets/stylesheets/sass/grid/tiles.sass +8 -6
  43. data/app/assets/stylesheets/sass/helpers/_all.sass +10 -0
  44. data/app/assets/stylesheets/sass/helpers/color.sass +37 -0
  45. data/app/assets/stylesheets/sass/helpers/float.sass +8 -0
  46. data/app/assets/stylesheets/sass/helpers/other.sass +8 -0
  47. data/app/assets/stylesheets/sass/helpers/overflow.sass +2 -0
  48. data/app/assets/stylesheets/sass/helpers/position.sass +5 -0
  49. data/app/assets/stylesheets/sass/helpers/spacing.sass +28 -0
  50. data/app/assets/stylesheets/sass/helpers/typography.sass +98 -0
  51. data/app/assets/stylesheets/sass/helpers/visibility.sass +122 -0
  52. data/app/assets/stylesheets/sass/layout/footer.sass +4 -1
  53. data/app/assets/stylesheets/sass/layout/hero.sass +23 -34
  54. data/app/assets/stylesheets/sass/utilities/_all.sass +1 -1
  55. data/app/assets/stylesheets/sass/utilities/controls.sass +3 -3
  56. data/app/assets/stylesheets/sass/utilities/derived-variables.scss +132 -0
  57. data/app/assets/stylesheets/sass/utilities/functions.sass +68 -15
  58. data/app/assets/stylesheets/sass/utilities/initial-variables.sass +10 -4
  59. data/app/assets/stylesheets/sass/utilities/mixins.sass +31 -7
  60. data/bulma-rails.gemspec +2 -2
  61. metadata +23 -8
  62. data/app/assets/stylesheets/sass/components/list.sass +0 -39
  63. data/app/assets/stylesheets/sass/utilities/derived-variables.sass +0 -85
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 9afe22c8ef08f3873497eeef4c048361a39a80a3a43411aa6cbabb5b9e562e7c
4
- data.tar.gz: 9fd523ea138f2b91eaf057c701eb38c1a04b9caec04452aa0a74dd62fc3b15a1
3
+ metadata.gz: 7c187d8e95e7482bbecab4a5e320ccdce88f049367e3d639054d1845fc99d0f4
4
+ data.tar.gz: 020c68825cef7a2d45a64d59f61b008326a99bd8cad9b6bd41a17a5c39b5edcf
5
5
  SHA512:
6
- metadata.gz: e6c1988b5a4fbda13325f709b248ced4a953d4c9d34c7210bc61ebcbcac53edafd79c8c13c2008be164efbc9724c51f8a18a59e913dbff566570cc856b81c399
7
- data.tar.gz: 5f1bd90a0bf42fe9448aa2c40f9dd9ac627a113967b7ada1ef4c248c7e5b1b36c96a28fa9fbb8ce16948674d205b3c162fb72761969174b2249aeb18da3eb686
6
+ metadata.gz: 01e0140a8537b859ea5ca35a1b31a93fd93a25737a69d42ce8d6f25ab4de50be9a7b3c8aedfeae6bfe1937475b620f4ad62dc97f1be3d0088080b3728e8b8650
7
+ data.tar.gz: a84d032d4f015c10933c1d3cdf6a6a616da806c8301e887da6134c19a257f7c8941a126f4dd2157cf9ab8f23d93920495db9f54d2d9a0d4b3e675e556f98a782
data/.gitignore CHANGED
@@ -1,2 +1,4 @@
1
1
  .bundle
2
2
  *.gem
3
+
4
+ .DS_Store
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.7.3"
11
+ gem "bulma-rails", "~> 0.9.0"
12
12
 
13
13
  And then execute:
14
14
 
@@ -1,8 +1,10 @@
1
1
  @charset "utf-8"
2
- /*! bulma.io v0.7.3 | MIT License | github.com/jgthms/bulma */
2
+ /*! bulma.io v0.9.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"
6
+ @import "sass/form/_all"
6
7
  @import "sass/components/_all"
7
8
  @import "sass/grid/_all"
9
+ @import "sass/helpers/_all"
8
10
  @import "sass/layout/_all"
@@ -2,4 +2,3 @@
2
2
 
3
3
  @import "minireset.sass"
4
4
  @import "generic.sass"
5
- @import "helpers.sass"
@@ -1,8 +1,13 @@
1
- $body-background-color: $white !default
1
+ $body-background-color: $scheme-main !default
2
2
  $body-size: 16px !default
3
+ $body-min-width: 300px !default
3
4
  $body-rendering: optimizeLegibility !default
4
5
  $body-family: $family-primary !default
6
+ $body-overflow-x: hidden !default
7
+ $body-overflow-y: scroll !default
8
+
5
9
  $body-color: $text !default
10
+ $body-font-size: 1em !default
6
11
  $body-weight: $weight-normal !default
7
12
  $body-line-height: 1.5 !default
8
13
 
@@ -11,6 +16,8 @@ $code-padding: 0.25em 0.5em 0.25em !default
11
16
  $code-weight: normal !default
12
17
  $code-size: 0.875em !default
13
18
 
19
+ $small-font-size: 0.875em !default
20
+
14
21
  $hr-background-color: $background !default
15
22
  $hr-height: 2px !default
16
23
  $hr-margin: 1.5rem 0 !default
@@ -18,14 +25,18 @@ $hr-margin: 1.5rem 0 !default
18
25
  $strong-color: $text-strong !default
19
26
  $strong-weight: $weight-bold !default
20
27
 
28
+ $pre-font-size: 0.875em !default
29
+ $pre-padding: 1.25rem 1.5rem !default
30
+ $pre-code-font-size: 1em !default
31
+
21
32
  html
22
33
  background-color: $body-background-color
23
34
  font-size: $body-size
24
35
  -moz-osx-font-smoothing: grayscale
25
36
  -webkit-font-smoothing: antialiased
26
- min-width: 300px
27
- overflow-x: hidden
28
- overflow-y: scroll
37
+ min-width: $body-min-width
38
+ overflow-x: $body-overflow-x
39
+ overflow-y: $body-overflow-y
29
40
  text-rendering: $body-rendering
30
41
  text-size-adjust: 100%
31
42
 
@@ -53,7 +64,7 @@ pre
53
64
 
54
65
  body
55
66
  color: $body-color
56
- font-size: 1rem
67
+ font-size: $body-font-size
57
68
  font-weight: $body-weight
58
69
  line-height: $body-line-height
59
70
 
@@ -91,7 +102,7 @@ input[type="radio"]
91
102
  vertical-align: baseline
92
103
 
93
104
  small
94
- font-size: 0.875em
105
+ font-size: $small-font-size
95
106
 
96
107
  span
97
108
  font-style: inherit
@@ -110,21 +121,22 @@ pre
110
121
  +overflow-touch
111
122
  background-color: $pre-background
112
123
  color: $pre
113
- font-size: 0.875em
124
+ font-size: $pre-font-size
114
125
  overflow-x: auto
115
- padding: 1.25rem 1.5rem
126
+ padding: $pre-padding
116
127
  white-space: pre
117
128
  word-wrap: normal
118
129
  code
119
130
  background-color: transparent
120
131
  color: currentColor
121
- font-size: 1em
132
+ font-size: $pre-code-font-size
122
133
  padding: 0
123
134
 
124
135
  table
125
136
  td,
126
137
  th
127
- text-align: left
128
138
  vertical-align: top
139
+ &:not([align])
140
+ text-align: inherit
129
141
  th
130
142
  color: $text-strong
@@ -1,276 +1 @@
1
- // Float
2
-
3
- .is-clearfix
4
- +clearfix
5
-
6
- .is-pulled-left
7
- float: left !important
8
-
9
- .is-pulled-right
10
- float: right !important
11
-
12
- // Overflow
13
-
14
- .is-clipped
15
- overflow: hidden !important
16
-
17
- // Overlay
18
-
19
- .is-overlay
20
- @extend %overlay
21
-
22
- // Typography
23
-
24
- =typography-size($target:'')
25
- @each $size in $sizes
26
- $i: index($sizes, $size)
27
- .is-size-#{$i}#{if($target == '', '', '-' + $target)}
28
- font-size: $size !important
29
-
30
- +typography-size()
31
-
32
- +mobile
33
- +typography-size('mobile')
34
-
35
- +tablet
36
- +typography-size('tablet')
37
-
38
- +touch
39
- +typography-size('touch')
40
-
41
- +desktop
42
- +typography-size('desktop')
43
-
44
- +widescreen
45
- +typography-size('widescreen')
46
-
47
- +fullhd
48
- +typography-size('fullhd')
49
-
50
- $alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'right': 'right')
51
-
52
- @each $alignment, $text-align in $alignments
53
- .has-text-#{$alignment}
54
- text-align: #{$text-align} !important
55
-
56
- @each $alignment, $text-align in $alignments
57
- +mobile
58
- .has-text-#{$alignment}-mobile
59
- text-align: #{$text-align} !important
60
- +tablet
61
- .has-text-#{$alignment}-tablet
62
- text-align: #{$text-align} !important
63
- +tablet-only
64
- .has-text-#{$alignment}-tablet-only
65
- text-align: #{$text-align} !important
66
- +touch
67
- .has-text-#{$alignment}-touch
68
- text-align: #{$text-align} !important
69
- +desktop
70
- .has-text-#{$alignment}-desktop
71
- text-align: #{$text-align} !important
72
- +desktop-only
73
- .has-text-#{$alignment}-desktop-only
74
- text-align: #{$text-align} !important
75
- +widescreen
76
- .has-text-#{$alignment}-widescreen
77
- text-align: #{$text-align} !important
78
- +widescreen-only
79
- .has-text-#{$alignment}-widescreen-only
80
- text-align: #{$text-align} !important
81
- +fullhd
82
- .has-text-#{$alignment}-fullhd
83
- text-align: #{$text-align} !important
84
-
85
- .is-capitalized
86
- text-transform: capitalize !important
87
-
88
- .is-lowercase
89
- text-transform: lowercase !important
90
-
91
- .is-uppercase
92
- text-transform: uppercase !important
93
-
94
- .is-italic
95
- font-style: italic !important
96
-
97
- @each $name, $pair in $colors
98
- $color: nth($pair, 1)
99
- .has-text-#{$name}
100
- color: $color !important
101
- a.has-text-#{$name}
102
- &:hover,
103
- &:focus
104
- color: darken($color, 10%) !important
105
- .has-background-#{$name}
106
- background-color: $color !important
107
-
108
- @each $name, $shade in $shades
109
- .has-text-#{$name}
110
- color: $shade !important
111
- .has-background-#{$name}
112
- background-color: $shade !important
113
-
114
- .has-text-weight-light
115
- font-weight: $weight-light !important
116
- .has-text-weight-normal
117
- font-weight: $weight-normal !important
118
- .has-text-weight-semibold
119
- font-weight: $weight-semibold !important
120
- .has-text-weight-bold
121
- font-weight: $weight-bold !important
122
-
123
- .is-family-primary
124
- font-family: $family-primary !important
125
-
126
- .is-family-secondary
127
- font-family: $family-secondary !important
128
-
129
- .is-family-sans-serif
130
- font-family: $family-sans-serif !important
131
-
132
- .is-family-monospace
133
- font-family: $family-monospace !important
134
-
135
- .is-family-code
136
- font-family: $family-code !important
137
-
138
- // Visibility
139
-
140
- $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
141
-
142
- @each $display in $displays
143
- .is-#{$display}
144
- display: #{$display} !important
145
- +mobile
146
- .is-#{$display}-mobile
147
- display: #{$display} !important
148
- +tablet
149
- .is-#{$display}-tablet
150
- display: #{$display} !important
151
- +tablet-only
152
- .is-#{$display}-tablet-only
153
- display: #{$display} !important
154
- +touch
155
- .is-#{$display}-touch
156
- display: #{$display} !important
157
- +desktop
158
- .is-#{$display}-desktop
159
- display: #{$display} !important
160
- +desktop-only
161
- .is-#{$display}-desktop-only
162
- display: #{$display} !important
163
- +widescreen
164
- .is-#{$display}-widescreen
165
- display: #{$display} !important
166
- +widescreen-only
167
- .is-#{$display}-widescreen-only
168
- display: #{$display} !important
169
- +fullhd
170
- .is-#{$display}-fullhd
171
- display: #{$display} !important
172
-
173
- .is-hidden
174
- display: none !important
175
-
176
- .is-sr-only
177
- border: none !important
178
- clip: rect(0, 0, 0, 0) !important
179
- height: 0.01em !important
180
- overflow: hidden !important
181
- padding: 0 !important
182
- position: absolute !important
183
- white-space: nowrap !important
184
- width: 0.01em !important
185
-
186
- +mobile
187
- .is-hidden-mobile
188
- display: none !important
189
-
190
- +tablet
191
- .is-hidden-tablet
192
- display: none !important
193
-
194
- +tablet-only
195
- .is-hidden-tablet-only
196
- display: none !important
197
-
198
- +touch
199
- .is-hidden-touch
200
- display: none !important
201
-
202
- +desktop
203
- .is-hidden-desktop
204
- display: none !important
205
-
206
- +desktop-only
207
- .is-hidden-desktop-only
208
- display: none !important
209
-
210
- +widescreen
211
- .is-hidden-widescreen
212
- display: none !important
213
-
214
- +widescreen-only
215
- .is-hidden-widescreen-only
216
- display: none !important
217
-
218
- +fullhd
219
- .is-hidden-fullhd
220
- display: none !important
221
-
222
- .is-invisible
223
- visibility: hidden !important
224
-
225
- +mobile
226
- .is-invisible-mobile
227
- visibility: hidden !important
228
-
229
- +tablet
230
- .is-invisible-tablet
231
- visibility: hidden !important
232
-
233
- +tablet-only
234
- .is-invisible-tablet-only
235
- visibility: hidden !important
236
-
237
- +touch
238
- .is-invisible-touch
239
- visibility: hidden !important
240
-
241
- +desktop
242
- .is-invisible-desktop
243
- visibility: hidden !important
244
-
245
- +desktop-only
246
- .is-invisible-desktop-only
247
- visibility: hidden !important
248
-
249
- +widescreen
250
- .is-invisible-widescreen
251
- visibility: hidden !important
252
-
253
- +widescreen-only
254
- .is-invisible-widescreen-only
255
- visibility: hidden !important
256
-
257
- +fullhd
258
- .is-invisible-fullhd
259
- visibility: hidden !important
260
-
261
- // Other
262
-
263
- .is-marginless
264
- margin: 0 !important
265
-
266
- .is-paddingless
267
- padding: 0 !important
268
-
269
- .is-radiusless
270
- border-radius: 0 !important
271
-
272
- .is-shadowless
273
- box-shadow: none !important
274
-
275
- .is-unselectable
276
- @extend %unselectable
1
+ @warn "The helpers.sass file is DEPRECATED. It has moved into its own /helpers folder. Please import sass/helpers/_all instead."
@@ -1,4 +1,4 @@
1
- /*! minireset.css v0.0.3 | MIT License | github.com/jgthms/minireset.css */
1
+ /*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
2
2
  // Blocks
3
3
  html,
4
4
  body,
@@ -59,7 +59,6 @@ html
59
59
 
60
60
  // Media
61
61
  img,
62
- audio,
63
62
  video
64
63
  height: auto
65
64
  max-width: 100%
@@ -76,4 +75,5 @@ table
76
75
  td,
77
76
  th
78
77
  padding: 0
79
- text-align: left
78
+ &:not([align])
79
+ text-align: inherit
@@ -4,7 +4,6 @@
4
4
  @import "card.sass"
5
5
  @import "dropdown.sass"
6
6
  @import "level.sass"
7
- @import "list.sass"
8
7
  @import "media.sass"
9
8
  @import "menu.sass"
10
9
  @import "message.sass"
@@ -5,7 +5,7 @@ $breadcrumb-item-active-color: $text-strong !default
5
5
  $breadcrumb-item-padding-vertical: 0 !default
6
6
  $breadcrumb-item-padding-horizontal: 0.75em !default
7
7
 
8
- $breadcrumb-item-separator-color: $grey-light !default
8
+ $breadcrumb-item-separator-color: $border-hover !default
9
9
 
10
10
  .breadcrumb
11
11
  @extend %block
@@ -24,7 +24,7 @@ $breadcrumb-item-separator-color: $grey-light !default
24
24
  align-items: center
25
25
  display: flex
26
26
  &:first-child a
27
- padding-left: 0
27
+ +ltr-property("padding", 0, false)
28
28
  &.is-active
29
29
  a
30
30
  color: $breadcrumb-item-active-color
@@ -41,9 +41,9 @@ $breadcrumb-item-separator-color: $grey-light !default
41
41
  justify-content: flex-start
42
42
  .icon
43
43
  &:first-child
44
- margin-right: 0.5em
44
+ +ltr-property("margin", 0.5em)
45
45
  &:last-child
46
- margin-left: 0.5em
46
+ +ltr-property("margin", 0.5em, false)
47
47
  // Alignment
48
48
  &.is-centered
49
49
  ol,