bulma-rails 0.6.0 → 0.6.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/app/assets/stylesheets/bulma.sass +1 -1
- data/app/assets/stylesheets/sass/base/_all.sass +0 -0
- data/app/assets/stylesheets/sass/base/generic.sass +1 -1
- data/app/assets/stylesheets/sass/base/helpers.sass +39 -0
- data/app/assets/stylesheets/sass/base/minireset.sass +0 -0
- data/app/assets/stylesheets/sass/components/_all.sass +0 -0
- data/app/assets/stylesheets/sass/components/breadcrumb.sass +0 -0
- data/app/assets/stylesheets/sass/components/card.sass +0 -0
- data/app/assets/stylesheets/sass/components/dropdown.sass +0 -0
- data/app/assets/stylesheets/sass/components/level.sass +0 -0
- data/app/assets/stylesheets/sass/components/media.sass +0 -0
- data/app/assets/stylesheets/sass/components/menu.sass +0 -0
- data/app/assets/stylesheets/sass/components/message.sass +0 -0
- data/app/assets/stylesheets/sass/components/modal.sass +0 -0
- data/app/assets/stylesheets/sass/components/navbar.sass +81 -4
- data/app/assets/stylesheets/sass/components/pagination.sass +0 -0
- data/app/assets/stylesheets/sass/components/panel.sass +0 -0
- data/app/assets/stylesheets/sass/components/tabs.sass +0 -0
- data/app/assets/stylesheets/sass/elements/_all.sass +0 -0
- data/app/assets/stylesheets/sass/elements/box.sass +0 -0
- data/app/assets/stylesheets/sass/elements/button.sass +40 -0
- data/app/assets/stylesheets/sass/elements/container.sass +0 -0
- data/app/assets/stylesheets/sass/elements/content.sass +0 -0
- data/app/assets/stylesheets/sass/elements/form.sass +5 -0
- data/app/assets/stylesheets/sass/elements/icon.sass +0 -0
- data/app/assets/stylesheets/sass/elements/image.sass +0 -0
- data/app/assets/stylesheets/sass/elements/notification.sass +0 -0
- data/app/assets/stylesheets/sass/elements/other.sass +0 -0
- data/app/assets/stylesheets/sass/elements/progress.sass +5 -0
- data/app/assets/stylesheets/sass/elements/table.sass +7 -1
- data/app/assets/stylesheets/sass/elements/tag.sass +22 -0
- data/app/assets/stylesheets/sass/elements/title.sass +0 -0
- data/app/assets/stylesheets/sass/grid/_all.sass +0 -0
- data/app/assets/stylesheets/sass/grid/columns.sass +149 -1
- data/app/assets/stylesheets/sass/grid/tiles.sass +0 -0
- data/app/assets/stylesheets/sass/layout/_all.sass +0 -0
- data/app/assets/stylesheets/sass/layout/footer.sass +0 -0
- data/app/assets/stylesheets/sass/layout/hero.sass +0 -0
- data/app/assets/stylesheets/sass/layout/section.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/_all.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/animations.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/controls.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/derived-variables.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/functions.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/initial-variables.sass +0 -0
- data/app/assets/stylesheets/sass/utilities/mixins.sass +13 -16
- data/bulma-rails.gemspec +1 -1
- metadata +2 -4
- data/app/assets/stylesheets/sass/components/nav.sass +0 -125
- data/app/assets/stylesheets/sass/utilities/variables.sass +0 -150
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 26be2ca12c9d47bcd329d2a97e46a45dac8e18a7
|
4
|
+
data.tar.gz: 86390307107024d31bdf3c2f96475c65229248fa
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 6ac2b4fea00ada7f05a5a0c8e697b2de5c704b1a29f3ff1ab9ebcc1d8265d02174a514c523bfcc4b345f62f920fc982c3d60b419728ec37e466927fba2660fec
|
7
|
+
data.tar.gz: bd9bcd883e2bbae9dbb2cc68272b32e23d9a2c7d37a827051858c8421f3c2b7e73b2ef175c6583d014a5a05f9580596ed112af9c82f5520627cc165a5b085047
|
data/README.md
CHANGED
File without changes
|
@@ -185,6 +185,45 @@ $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
|
|
185
185
|
.is-hidden-fullhd
|
186
186
|
display: none !important
|
187
187
|
|
188
|
+
.is-invisible
|
189
|
+
visibility: hidden !important
|
190
|
+
|
191
|
+
+mobile
|
192
|
+
.is-invisible-mobile
|
193
|
+
visibility: hidden !important
|
194
|
+
|
195
|
+
+tablet
|
196
|
+
.is-invisible-tablet
|
197
|
+
visibility: hidden !important
|
198
|
+
|
199
|
+
+tablet-only
|
200
|
+
.is-invisible-tablet-only
|
201
|
+
visibility: hidden !important
|
202
|
+
|
203
|
+
+touch
|
204
|
+
.is-invisible-touch
|
205
|
+
visibility: hidden !important
|
206
|
+
|
207
|
+
+desktop
|
208
|
+
.is-invisible-desktop
|
209
|
+
visibility: hidden !important
|
210
|
+
|
211
|
+
+desktop-only
|
212
|
+
.is-invisible-desktop-only
|
213
|
+
visibility: hidden !important
|
214
|
+
|
215
|
+
+widescreen
|
216
|
+
.is-invisible-widescreen
|
217
|
+
visibility: hidden !important
|
218
|
+
|
219
|
+
+widescreen-only
|
220
|
+
.is-invisible-widescreen-only
|
221
|
+
visibility: hidden !important
|
222
|
+
|
223
|
+
+fullhd
|
224
|
+
.is-invisible-fullhd
|
225
|
+
visibility: hidden !important
|
226
|
+
|
188
227
|
// Other
|
189
228
|
|
190
229
|
.is-marginless
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
@@ -1,8 +1,9 @@
|
|
1
1
|
$navbar-background-color: $white !default
|
2
2
|
$navbar-height: 3.25rem !default
|
3
|
+
$navbar-fixed-z: 30 !default
|
3
4
|
|
4
5
|
$navbar-item-color: $grey-dark !default
|
5
|
-
$navbar-item-hover-color: $
|
6
|
+
$navbar-item-hover-color: $link !default
|
6
7
|
$navbar-item-hover-background-color: $background !default
|
7
8
|
$navbar-item-active-color: $black !default
|
8
9
|
$navbar-item-active-background-color: transparent !default
|
@@ -33,6 +34,17 @@ $navbar-dropdown-item-active-background-color: $background !default
|
|
33
34
|
|
34
35
|
$navbar-divider-background-color: $border !default
|
35
36
|
|
37
|
+
=navbar-fixed
|
38
|
+
left: 0
|
39
|
+
position: fixed
|
40
|
+
right: 0
|
41
|
+
z-index: $navbar-fixed-z
|
42
|
+
|
43
|
+
=navbar-fixed-html
|
44
|
+
left: 0
|
45
|
+
position: fixed
|
46
|
+
right: 0
|
47
|
+
|
36
48
|
.navbar
|
37
49
|
background-color: $navbar-background-color
|
38
50
|
min-height: $navbar-height
|
@@ -87,6 +99,21 @@ $navbar-divider-background-color: $border !default
|
|
87
99
|
width: 100%
|
88
100
|
&.has-shadow
|
89
101
|
box-shadow: 0 2px 3px rgba($black, 0.1)
|
102
|
+
&.is-fixed-bottom,
|
103
|
+
&.is-fixed-top
|
104
|
+
+navbar-fixed
|
105
|
+
&.is-fixed-bottom
|
106
|
+
bottom: 0
|
107
|
+
&.has-shadow
|
108
|
+
box-shadow: 0 -2px 3px rgba($black, 0.1)
|
109
|
+
&.is-fixed-top
|
110
|
+
top: 0
|
111
|
+
|
112
|
+
html.has-navbar-fixed-top
|
113
|
+
padding-top: $navbar-height
|
114
|
+
|
115
|
+
html.has-navbar-fixed-bottom
|
116
|
+
padding-bottom: $navbar-height
|
90
117
|
|
91
118
|
.navbar-brand,
|
92
119
|
.navbar-tabs
|
@@ -117,7 +144,7 @@ $navbar-divider-background-color: $border !default
|
|
117
144
|
position: relative
|
118
145
|
|
119
146
|
a.navbar-item,
|
120
|
-
.navbar-link
|
147
|
+
a.navbar-link
|
121
148
|
&:hover,
|
122
149
|
&.is-active
|
123
150
|
background-color: $navbar-item-hover-background-color
|
@@ -130,6 +157,9 @@ a.navbar-item,
|
|
130
157
|
max-height: $navbar-item-img-max-height
|
131
158
|
&.has-dropdown
|
132
159
|
padding: 0
|
160
|
+
&.is-expanded
|
161
|
+
flex-grow: 1
|
162
|
+
flex-shrink: 1
|
133
163
|
&.is-tab
|
134
164
|
border-bottom: 1px solid transparent
|
135
165
|
min-height: $navbar-height
|
@@ -181,6 +211,27 @@ a.navbar-item,
|
|
181
211
|
padding: 0.5rem 0
|
182
212
|
&.is-active
|
183
213
|
display: block
|
214
|
+
// Fixed navbar
|
215
|
+
.navbar
|
216
|
+
&.is-fixed-bottom-touch,
|
217
|
+
&.is-fixed-top-touch
|
218
|
+
+navbar-fixed
|
219
|
+
&.is-fixed-bottom-touch
|
220
|
+
bottom: 0
|
221
|
+
&.has-shadow
|
222
|
+
box-shadow: 0 -2px 3px rgba($black, 0.1)
|
223
|
+
&.is-fixed-top-touch
|
224
|
+
top: 0
|
225
|
+
&.is-fixed-top,
|
226
|
+
&.is-fixed-top-touch
|
227
|
+
.navbar-menu
|
228
|
+
+overflow-touch
|
229
|
+
max-height: calc(100vh - #{$navbar-height})
|
230
|
+
overflow: auto
|
231
|
+
html.has-navbar-fixed-top-touch
|
232
|
+
padding-top: $navbar-height
|
233
|
+
html.has-navbar-fixed-bottom-touch
|
234
|
+
padding-bottom: $navbar-height
|
184
235
|
|
185
236
|
+desktop
|
186
237
|
.navbar,
|
@@ -193,7 +244,7 @@ a.navbar-item,
|
|
193
244
|
min-height: $navbar-height
|
194
245
|
&.is-transparent
|
195
246
|
a.navbar-item,
|
196
|
-
.navbar-link
|
247
|
+
a.navbar-link
|
197
248
|
&:hover,
|
198
249
|
&.is-active
|
199
250
|
background-color: transparent !important
|
@@ -219,6 +270,16 @@ a.navbar-item,
|
|
219
270
|
.navbar-item
|
220
271
|
&.has-dropdown
|
221
272
|
align-items: stretch
|
273
|
+
&.has-dropdown-up
|
274
|
+
.navbar-link::after
|
275
|
+
transform: rotate(135deg) translate(0.25em, -0.25em)
|
276
|
+
.navbar-dropdown
|
277
|
+
border-bottom: $navbar-dropdown-border-top
|
278
|
+
border-radius: $navbar-dropdown-radius $navbar-dropdown-radius 0 0
|
279
|
+
border-top: none
|
280
|
+
bottom: 100%
|
281
|
+
box-shadow: 0 -8px 8px rgba($black, 0.1)
|
282
|
+
top: auto
|
222
283
|
&.is-active,
|
223
284
|
&.is-hoverable:hover
|
224
285
|
.navbar-dropdown
|
@@ -282,14 +343,30 @@ a.navbar-item,
|
|
282
343
|
right: 0
|
283
344
|
.navbar-divider
|
284
345
|
display: block
|
346
|
+
.navbar > .container,
|
285
347
|
.container > .navbar
|
286
348
|
.navbar-brand
|
287
349
|
margin-left: -1rem
|
288
350
|
.navbar-menu
|
289
351
|
margin-right: -1rem
|
352
|
+
// Fixed navbar
|
353
|
+
.navbar
|
354
|
+
&.is-fixed-bottom-desktop,
|
355
|
+
&.is-fixed-top-desktop
|
356
|
+
+navbar-fixed
|
357
|
+
&.is-fixed-bottom-desktop
|
358
|
+
bottom: 0
|
359
|
+
&.has-shadow
|
360
|
+
box-shadow: 0 -2px 3px rgba($black, 0.1)
|
361
|
+
&.is-fixed-top-desktop
|
362
|
+
top: 0
|
363
|
+
html.has-navbar-fixed-top-desktop
|
364
|
+
padding-top: $navbar-height
|
365
|
+
html.has-navbar-fixed-bottom-desktop
|
366
|
+
padding-bottom: $navbar-height
|
290
367
|
// Hover/Active states
|
291
368
|
a.navbar-item,
|
292
|
-
.navbar-link
|
369
|
+
a.navbar-link
|
293
370
|
&.is-active
|
294
371
|
color: $navbar-item-active-color
|
295
372
|
&.is-active:not(:hover)
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
@@ -199,3 +199,43 @@ $button-static-border-color: $grey-lighter !default
|
|
199
199
|
color: $button-static-color
|
200
200
|
box-shadow: none
|
201
201
|
pointer-events: none
|
202
|
+
|
203
|
+
.buttons
|
204
|
+
align-items: center
|
205
|
+
display: flex
|
206
|
+
flex-wrap: wrap
|
207
|
+
justify-content: flex-start
|
208
|
+
.button
|
209
|
+
margin-bottom: 0.5rem
|
210
|
+
&:not(:last-child)
|
211
|
+
margin-right: 0.5rem
|
212
|
+
&:last-child
|
213
|
+
margin-bottom: -0.5rem
|
214
|
+
&:not(:last-child)
|
215
|
+
margin-bottom: 1rem
|
216
|
+
&.has-addons
|
217
|
+
.button
|
218
|
+
&:not(:first-child)
|
219
|
+
border-bottom-left-radius: 0
|
220
|
+
border-top-left-radius: 0
|
221
|
+
&:not(:last-child)
|
222
|
+
border-bottom-right-radius: 0
|
223
|
+
border-top-right-radius: 0
|
224
|
+
margin-right: -1px
|
225
|
+
&:last-child
|
226
|
+
margin-right: 0
|
227
|
+
&:hover,
|
228
|
+
&.is-hovered
|
229
|
+
z-index: 2
|
230
|
+
&:focus,
|
231
|
+
&.is-focused,
|
232
|
+
&:active,
|
233
|
+
&.is-active,
|
234
|
+
&.is-selected
|
235
|
+
z-index: 3
|
236
|
+
&:hover
|
237
|
+
z-index: 4
|
238
|
+
&.is-centered
|
239
|
+
justify-content: center
|
240
|
+
&.is-right
|
241
|
+
justify-content: flex-end
|
File without changes
|
File without changes
|
@@ -269,6 +269,11 @@ $help-size: $size-small !default
|
|
269
269
|
.file-name
|
270
270
|
border-bottom-left-radius: 0
|
271
271
|
border-top-left-radius: 0
|
272
|
+
&.is-empty
|
273
|
+
.file-cta
|
274
|
+
border-radius: $file-radius
|
275
|
+
.file-name
|
276
|
+
display: none
|
272
277
|
&.is-centered
|
273
278
|
justify-content: center
|
274
279
|
&.is-right
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
@@ -18,6 +18,9 @@ $progress-value-background-color: $text !default
|
|
18
18
|
background-color: $progress-value-background-color
|
19
19
|
&::-moz-progress-bar
|
20
20
|
background-color: $progress-value-background-color
|
21
|
+
&::-ms-fill
|
22
|
+
background-color: $progress-value-background-color
|
23
|
+
border: none
|
21
24
|
// Colors
|
22
25
|
@each $name, $pair in $colors
|
23
26
|
$color: nth($pair, 1)
|
@@ -26,6 +29,8 @@ $progress-value-background-color: $text !default
|
|
26
29
|
background-color: $color
|
27
30
|
&::-moz-progress-bar
|
28
31
|
background-color: $color
|
32
|
+
&::-ms-fill
|
33
|
+
background-color: $color
|
29
34
|
// Sizes
|
30
35
|
&.is-small
|
31
36
|
height: $size-small
|
@@ -41,6 +41,12 @@ $table-striped-row-even-hover-background-color: $white-ter !default
|
|
41
41
|
&.is-narrow
|
42
42
|
white-space: nowrap
|
43
43
|
width: 1%
|
44
|
+
&.is-selected
|
45
|
+
background-color: $table-row-active-background-color
|
46
|
+
color: $table-row-active-color
|
47
|
+
a,
|
48
|
+
strong
|
49
|
+
color: currentColor
|
44
50
|
th
|
45
51
|
color: $table-cell-heading-color
|
46
52
|
text-align: left
|
@@ -85,7 +91,7 @@ $table-striped-row-even-hover-background-color: $white-ter !default
|
|
85
91
|
width: 100%
|
86
92
|
&.is-hoverable
|
87
93
|
tbody
|
88
|
-
tr
|
94
|
+
tr:not(.is-selected)
|
89
95
|
&:hover
|
90
96
|
background-color: $table-row-hover-background-color
|
91
97
|
&.is-striped
|
@@ -25,6 +25,18 @@ $tag-delete-margin: 1px !default
|
|
25
25
|
&:not(:last-child)
|
26
26
|
border-bottom-right-radius: 0
|
27
27
|
border-top-right-radius: 0
|
28
|
+
&.is-centered
|
29
|
+
justify-content: center
|
30
|
+
.tag
|
31
|
+
margin-right: 0.25rem
|
32
|
+
margin-left: 0.25rem
|
33
|
+
&.is-right
|
34
|
+
justify-content: flex-end
|
35
|
+
.tag
|
36
|
+
&:not(:first-child)
|
37
|
+
margin-left: 0.5rem
|
38
|
+
&:not(:last-child)
|
39
|
+
margin-right: 0
|
28
40
|
|
29
41
|
.tag:not(body)
|
30
42
|
align-items: center
|
@@ -54,6 +66,16 @@ $tag-delete-margin: 1px !default
|
|
54
66
|
font-size: $size-normal
|
55
67
|
&.is-large
|
56
68
|
font-size: $size-medium
|
69
|
+
.icon
|
70
|
+
&:first-child:not(:last-child)
|
71
|
+
margin-left: -0.375em
|
72
|
+
margin-right: 0.1875em
|
73
|
+
&:last-child:not(:first-child)
|
74
|
+
margin-left: 0.1875em
|
75
|
+
margin-right: -0.375em
|
76
|
+
&:first-child:last-child
|
77
|
+
margin-left: -0.375em
|
78
|
+
margin-right: -0.375em
|
57
79
|
// Modifiers
|
58
80
|
&.is-delete
|
59
81
|
margin-left: $tag-delete-margin
|
File without changes
|
File without changes
|
@@ -26,6 +26,18 @@ $column-gap: 0.75rem !default
|
|
26
26
|
.columns.is-mobile > &.is-one-quarter
|
27
27
|
flex: none
|
28
28
|
width: 25%
|
29
|
+
.columns.is-mobile > &.is-one-fifth
|
30
|
+
flex: none
|
31
|
+
width: 20%
|
32
|
+
.columns.is-mobile > &.is-two-fifths
|
33
|
+
flex: none
|
34
|
+
width: 40%
|
35
|
+
.columns.is-mobile > &.is-three-fifths
|
36
|
+
flex: none
|
37
|
+
width: 60%
|
38
|
+
.columns.is-mobile > &.is-four-fifths
|
39
|
+
flex: none
|
40
|
+
width: 80%
|
29
41
|
.columns.is-mobile > &.is-offset-three-quarters
|
30
42
|
margin-left: 75%
|
31
43
|
.columns.is-mobile > &.is-offset-two-thirds
|
@@ -36,6 +48,14 @@ $column-gap: 0.75rem !default
|
|
36
48
|
margin-left: 33.3333%
|
37
49
|
.columns.is-mobile > &.is-offset-one-quarter
|
38
50
|
margin-left: 25%
|
51
|
+
.columns.is-mobile > &.is-offset-one-fifth
|
52
|
+
margin-left: 20%
|
53
|
+
.columns.is-mobile > &.is-offset-two-fifths
|
54
|
+
margin-left: 40%
|
55
|
+
.columns.is-mobile > &.is-offset-three-fifths
|
56
|
+
margin-left: 60%
|
57
|
+
.columns.is-mobile > &.is-offset-four-fifths
|
58
|
+
margin-left: 80%
|
39
59
|
@for $i from 1 through 12
|
40
60
|
.columns.is-mobile > &.is-#{$i}
|
41
61
|
flex: none
|
@@ -63,6 +83,18 @@ $column-gap: 0.75rem !default
|
|
63
83
|
&.is-one-quarter-mobile
|
64
84
|
flex: none
|
65
85
|
width: 25%
|
86
|
+
&.is-one-fifth-mobile
|
87
|
+
flex: none
|
88
|
+
width: 20%
|
89
|
+
&.is-two-fifths-mobile
|
90
|
+
flex: none
|
91
|
+
width: 40%
|
92
|
+
&.is-three-fifths-mobile
|
93
|
+
flex: none
|
94
|
+
width: 60%
|
95
|
+
&.is-four-fifths-mobile
|
96
|
+
flex: none
|
97
|
+
width: 80%
|
66
98
|
&.is-offset-three-quarters-mobile
|
67
99
|
margin-left: 75%
|
68
100
|
&.is-offset-two-thirds-mobile
|
@@ -73,6 +105,14 @@ $column-gap: 0.75rem !default
|
|
73
105
|
margin-left: 33.3333%
|
74
106
|
&.is-offset-one-quarter-mobile
|
75
107
|
margin-left: 25%
|
108
|
+
&.is-offset-one-fifth-mobile
|
109
|
+
margin-left: 20%
|
110
|
+
&.is-offset-two-fifths-mobile
|
111
|
+
margin-left: 40%
|
112
|
+
&.is-offset-three-fifths-mobile
|
113
|
+
margin-left: 60%
|
114
|
+
&.is-offset-four-fifths-mobile
|
115
|
+
margin-left: 80%
|
76
116
|
@for $i from 1 through 12
|
77
117
|
&.is-#{$i}-mobile
|
78
118
|
flex: none
|
@@ -107,6 +147,22 @@ $column-gap: 0.75rem !default
|
|
107
147
|
&.is-one-quarter-tablet
|
108
148
|
flex: none
|
109
149
|
width: 25%
|
150
|
+
&.is-one-fifth,
|
151
|
+
&.is-one-fifth-tablet
|
152
|
+
flex: none
|
153
|
+
width: 20%
|
154
|
+
&.is-two-fifths,
|
155
|
+
&.is-two-fifths-tablet
|
156
|
+
flex: none
|
157
|
+
width: 40%
|
158
|
+
&.is-three-fifths,
|
159
|
+
&.is-three-fifths-tablet
|
160
|
+
flex: none
|
161
|
+
width: 60%
|
162
|
+
&.is-four-fifths,
|
163
|
+
&.is-four-fifths-tablet
|
164
|
+
flex: none
|
165
|
+
width: 80%
|
110
166
|
&.is-offset-three-quarters,
|
111
167
|
&.is-offset-three-quarters-tablet
|
112
168
|
margin-left: 75%
|
@@ -122,6 +178,18 @@ $column-gap: 0.75rem !default
|
|
122
178
|
&.is-offset-one-quarter,
|
123
179
|
&.is-offset-one-quarter-tablet
|
124
180
|
margin-left: 25%
|
181
|
+
&.is-offset-one-fifth,
|
182
|
+
&.is-offset-one-fifth-tablet
|
183
|
+
margin-left: 20%
|
184
|
+
&.is-offset-two-fifths,
|
185
|
+
&.is-offset-two-fifths-tablet
|
186
|
+
margin-left: 40%
|
187
|
+
&.is-offset-three-fifths,
|
188
|
+
&.is-offset-three-fifths-tablet
|
189
|
+
margin-left: 60%
|
190
|
+
&.is-offset-four-fifths,
|
191
|
+
&.is-offset-four-fifths-tablet
|
192
|
+
margin-left: 80%
|
125
193
|
@for $i from 1 through 12
|
126
194
|
&.is-#{$i},
|
127
195
|
&.is-#{$i}-tablet
|
@@ -151,6 +219,18 @@ $column-gap: 0.75rem !default
|
|
151
219
|
&.is-one-quarter-touch
|
152
220
|
flex: none
|
153
221
|
width: 25%
|
222
|
+
&.is-one-fifth-touch
|
223
|
+
flex: none
|
224
|
+
width: 20%
|
225
|
+
&.is-two-fifths-touch
|
226
|
+
flex: none
|
227
|
+
width: 40%
|
228
|
+
&.is-three-fifths-touch
|
229
|
+
flex: none
|
230
|
+
width: 60%
|
231
|
+
&.is-four-fifths-touch
|
232
|
+
flex: none
|
233
|
+
width: 80%
|
154
234
|
&.is-offset-three-quarters-touch
|
155
235
|
margin-left: 75%
|
156
236
|
&.is-offset-two-thirds-touch
|
@@ -161,6 +241,14 @@ $column-gap: 0.75rem !default
|
|
161
241
|
margin-left: 33.3333%
|
162
242
|
&.is-offset-one-quarter-touch
|
163
243
|
margin-left: 25%
|
244
|
+
&.is-offset-one-fifth-touch
|
245
|
+
margin-left: 20%
|
246
|
+
&.is-offset-two-fifths-touch
|
247
|
+
margin-left: 40%
|
248
|
+
&.is-offset-three-fifths-touch
|
249
|
+
margin-left: 60%
|
250
|
+
&.is-offset-four-fifths-touch
|
251
|
+
margin-left: 80%
|
164
252
|
@for $i from 1 through 12
|
165
253
|
&.is-#{$i}-touch
|
166
254
|
flex: none
|
@@ -188,6 +276,18 @@ $column-gap: 0.75rem !default
|
|
188
276
|
&.is-one-quarter-desktop
|
189
277
|
flex: none
|
190
278
|
width: 25%
|
279
|
+
&.is-one-fifth-desktop
|
280
|
+
flex: none
|
281
|
+
width: 20%
|
282
|
+
&.is-two-fifths-desktop
|
283
|
+
flex: none
|
284
|
+
width: 40%
|
285
|
+
&.is-three-fifths-desktop
|
286
|
+
flex: none
|
287
|
+
width: 60%
|
288
|
+
&.is-four-fifths-desktop
|
289
|
+
flex: none
|
290
|
+
width: 80%
|
191
291
|
&.is-offset-three-quarters-desktop
|
192
292
|
margin-left: 75%
|
193
293
|
&.is-offset-two-thirds-desktop
|
@@ -198,6 +298,14 @@ $column-gap: 0.75rem !default
|
|
198
298
|
margin-left: 33.3333%
|
199
299
|
&.is-offset-one-quarter-desktop
|
200
300
|
margin-left: 25%
|
301
|
+
&.is-offset-one-fifth-desktop
|
302
|
+
margin-left: 20%
|
303
|
+
&.is-offset-two-fifths-desktop
|
304
|
+
margin-left: 40%
|
305
|
+
&.is-offset-three-fifths-desktop
|
306
|
+
margin-left: 60%
|
307
|
+
&.is-offset-four-fifths-desktop
|
308
|
+
margin-left: 80%
|
201
309
|
@for $i from 1 through 12
|
202
310
|
&.is-#{$i}-desktop
|
203
311
|
flex: none
|
@@ -225,6 +333,18 @@ $column-gap: 0.75rem !default
|
|
225
333
|
&.is-one-quarter-widescreen
|
226
334
|
flex: none
|
227
335
|
width: 25%
|
336
|
+
&.is-one-fifth-widescreen
|
337
|
+
flex: none
|
338
|
+
width: 20%
|
339
|
+
&.is-two-fifths-widescreen
|
340
|
+
flex: none
|
341
|
+
width: 40%
|
342
|
+
&.is-three-fifths-widescreen
|
343
|
+
flex: none
|
344
|
+
width: 60%
|
345
|
+
&.is-four-fifths-widescreen
|
346
|
+
flex: none
|
347
|
+
width: 80%
|
228
348
|
&.is-offset-three-quarters-widescreen
|
229
349
|
margin-left: 75%
|
230
350
|
&.is-offset-two-thirds-widescreen
|
@@ -235,6 +355,14 @@ $column-gap: 0.75rem !default
|
|
235
355
|
margin-left: 33.3333%
|
236
356
|
&.is-offset-one-quarter-widescreen
|
237
357
|
margin-left: 25%
|
358
|
+
&.is-offset-one-fifth-widescreen
|
359
|
+
margin-left: 20%
|
360
|
+
&.is-offset-two-fifths-widescreen
|
361
|
+
margin-left: 40%
|
362
|
+
&.is-offset-three-fifths-widescreen
|
363
|
+
margin-left: 60%
|
364
|
+
&.is-offset-four-fifths-widescreen
|
365
|
+
margin-left: 80%
|
238
366
|
@for $i from 1 through 12
|
239
367
|
&.is-#{$i}-widescreen
|
240
368
|
flex: none
|
@@ -262,6 +390,18 @@ $column-gap: 0.75rem !default
|
|
262
390
|
&.is-one-quarter-fullhd
|
263
391
|
flex: none
|
264
392
|
width: 25%
|
393
|
+
&.is-one-fifth-fullhd
|
394
|
+
flex: none
|
395
|
+
width: 20%
|
396
|
+
&.is-two-fifths-fullhd
|
397
|
+
flex: none
|
398
|
+
width: 40%
|
399
|
+
&.is-three-fifths-fullhd
|
400
|
+
flex: none
|
401
|
+
width: 60%
|
402
|
+
&.is-four-fifths-fullhd
|
403
|
+
flex: none
|
404
|
+
width: 80%
|
265
405
|
&.is-offset-three-quarters-fullhd
|
266
406
|
margin-left: 75%
|
267
407
|
&.is-offset-two-thirds-fullhd
|
@@ -272,6 +412,14 @@ $column-gap: 0.75rem !default
|
|
272
412
|
margin-left: 33.3333%
|
273
413
|
&.is-offset-one-quarter-fullhd
|
274
414
|
margin-left: 25%
|
415
|
+
&.is-offset-one-fifth-fullhd
|
416
|
+
margin-left: 20%
|
417
|
+
&.is-offset-two-fifths-fullhd
|
418
|
+
margin-left: 40%
|
419
|
+
&.is-offset-three-fifths-fullhd
|
420
|
+
margin-left: 60%
|
421
|
+
&.is-offset-four-fifths-fullhd
|
422
|
+
margin-left: 80%
|
275
423
|
@for $i from 1 through 12
|
276
424
|
&.is-#{$i}-fullhd
|
277
425
|
flex: none
|
@@ -325,4 +473,4 @@ $column-gap: 0.75rem !default
|
|
325
473
|
padding-right: var(--columnGap)
|
326
474
|
@for $i from 0 through 8
|
327
475
|
&.is-#{$i}
|
328
|
-
--columnGap: $i * 0.25rem
|
476
|
+
--columnGap: #{$i * 0.25rem}
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
@@ -10,6 +10,7 @@
|
|
10
10
|
pointer-events: none
|
11
11
|
position: absolute
|
12
12
|
transform: rotate(-45deg)
|
13
|
+
transform-origin: center
|
13
14
|
width: 0.5em
|
14
15
|
|
15
16
|
=block
|
@@ -42,7 +43,7 @@
|
|
42
43
|
display: inline-block
|
43
44
|
flex-grow: 0
|
44
45
|
flex-shrink: 0
|
45
|
-
font-size:
|
46
|
+
font-size: 0
|
46
47
|
height: 20px
|
47
48
|
max-height: 20px
|
48
49
|
max-width: 20px
|
@@ -115,34 +116,30 @@
|
|
115
116
|
background-color: currentColor
|
116
117
|
display: block
|
117
118
|
height: 1px
|
118
|
-
left: 50%
|
119
|
-
margin-left: -7px
|
119
|
+
left: calc(50% - 8px)
|
120
120
|
position: absolute
|
121
|
-
|
122
|
-
transition:
|
123
|
-
transition-property: background,
|
124
|
-
|
121
|
+
transform-origin: center
|
122
|
+
transition-duration: $speed
|
123
|
+
transition-property: background-color, opacity, transform
|
124
|
+
transition-timing-function: $easing
|
125
|
+
width: 16px
|
125
126
|
&:nth-child(1)
|
126
|
-
|
127
|
+
top: calc(50% - 6px)
|
127
128
|
&:nth-child(2)
|
128
|
-
|
129
|
+
top: calc(50% - 1px)
|
129
130
|
&:nth-child(3)
|
130
|
-
|
131
|
+
top: calc(50% + 4px)
|
131
132
|
&:hover
|
132
133
|
background-color: rgba(black, 0.05)
|
133
134
|
// Modifers
|
134
135
|
&.is-active
|
135
136
|
span
|
136
137
|
&:nth-child(1)
|
137
|
-
|
138
|
-
transform: rotate(45deg)
|
139
|
-
transform-origin: left top
|
138
|
+
transform: translateY(5px) rotate(45deg)
|
140
139
|
&:nth-child(2)
|
141
140
|
opacity: 0
|
142
141
|
&:nth-child(3)
|
143
|
-
|
144
|
-
transform: rotate(-45deg)
|
145
|
-
transform-origin: left bottom
|
142
|
+
transform: translateY(-5px) rotate(-45deg)
|
146
143
|
|
147
144
|
=loader
|
148
145
|
animation: spinAround 500ms infinite linear
|
data/bulma-rails.gemspec
CHANGED
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.6.
|
4
|
+
version: 0.6.1
|
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-
|
11
|
+
date: 2017-11-06 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: sass
|
@@ -47,7 +47,6 @@ files:
|
|
47
47
|
- app/assets/stylesheets/sass/components/menu.sass
|
48
48
|
- app/assets/stylesheets/sass/components/message.sass
|
49
49
|
- app/assets/stylesheets/sass/components/modal.sass
|
50
|
-
- app/assets/stylesheets/sass/components/nav.sass
|
51
50
|
- app/assets/stylesheets/sass/components/navbar.sass
|
52
51
|
- app/assets/stylesheets/sass/components/pagination.sass
|
53
52
|
- app/assets/stylesheets/sass/components/panel.sass
|
@@ -80,7 +79,6 @@ files:
|
|
80
79
|
- app/assets/stylesheets/sass/utilities/functions.sass
|
81
80
|
- app/assets/stylesheets/sass/utilities/initial-variables.sass
|
82
81
|
- app/assets/stylesheets/sass/utilities/mixins.sass
|
83
|
-
- app/assets/stylesheets/sass/utilities/variables.sass
|
84
82
|
- bulma-rails.gemspec
|
85
83
|
- lib/bulma-rails.rb
|
86
84
|
homepage: https://github.com/joshuajansen/bulma-rails
|
@@ -1,125 +0,0 @@
|
|
1
|
-
$nav-height: 3.25rem !default
|
2
|
-
|
3
|
-
// Components
|
4
|
-
|
5
|
-
.nav-toggle
|
6
|
-
+hamburger($nav-height)
|
7
|
-
// Responsiveness
|
8
|
-
+tablet
|
9
|
-
display: none
|
10
|
-
|
11
|
-
.nav-item
|
12
|
-
align-items: center
|
13
|
-
display: flex
|
14
|
-
flex-grow: 0
|
15
|
-
flex-shrink: 0
|
16
|
-
font-size: $size-normal
|
17
|
-
justify-content: center
|
18
|
-
line-height: 1.5
|
19
|
-
padding: 0.5rem 0.75rem
|
20
|
-
a
|
21
|
-
flex-grow: 1
|
22
|
-
flex-shrink: 0
|
23
|
-
img
|
24
|
-
max-height: 1.75rem
|
25
|
-
.tag
|
26
|
-
&:first-child:not(:last-child)
|
27
|
-
margin-right: 0.5rem
|
28
|
-
&:last-child:not(:first-child)
|
29
|
-
margin-left: 0.5rem
|
30
|
-
// Responsiveness
|
31
|
-
+mobile
|
32
|
-
justify-content: flex-start
|
33
|
-
|
34
|
-
.nav-item a:not(.button),
|
35
|
-
a.nav-item:not(.button)
|
36
|
-
color: $text-light
|
37
|
-
&:hover
|
38
|
-
color: $link-hover
|
39
|
-
// Modifiers
|
40
|
-
&.is-active
|
41
|
-
color: $link-active
|
42
|
-
&.is-tab
|
43
|
-
border-bottom: 1px solid transparent
|
44
|
-
border-top: 1px solid transparent
|
45
|
-
padding-bottom: calc(0.75rem - 1px)
|
46
|
-
padding-left: 1rem
|
47
|
-
padding-right: 1rem
|
48
|
-
padding-top: calc(0.75rem - 1px)
|
49
|
-
&:hover
|
50
|
-
border-bottom-color: $primary
|
51
|
-
border-top-color: transparent
|
52
|
-
&.is-active
|
53
|
-
border-bottom: 3px solid $primary
|
54
|
-
color: $primary
|
55
|
-
padding-bottom: calc(0.75rem - 3px)
|
56
|
-
// Responsiveness
|
57
|
-
+desktop
|
58
|
-
&.is-brand
|
59
|
-
padding-left: 0
|
60
|
-
|
61
|
-
// Containers
|
62
|
-
|
63
|
-
.nav-left,
|
64
|
-
.nav-right
|
65
|
-
+overflow-touch
|
66
|
-
align-items: stretch
|
67
|
-
display: flex
|
68
|
-
flex-grow: 1
|
69
|
-
flex-shrink: 0
|
70
|
-
max-width: 100%
|
71
|
-
overflow: auto
|
72
|
-
+widescreen
|
73
|
-
flex-basis: 0
|
74
|
-
|
75
|
-
.nav-left
|
76
|
-
justify-content: flex-start
|
77
|
-
white-space: nowrap
|
78
|
-
|
79
|
-
.nav-right
|
80
|
-
justify-content: flex-end
|
81
|
-
|
82
|
-
.nav-center
|
83
|
-
align-items: stretch
|
84
|
-
display: flex
|
85
|
-
flex-grow: 0
|
86
|
-
flex-shrink: 0
|
87
|
-
justify-content: center
|
88
|
-
margin-left: auto
|
89
|
-
margin-right: auto
|
90
|
-
|
91
|
-
.nav-menu
|
92
|
-
// Responsiveness
|
93
|
-
+mobile
|
94
|
-
&.nav-right
|
95
|
-
background-color: $white
|
96
|
-
box-shadow: 0 4px 7px rgba($black, 0.1)
|
97
|
-
left: 0
|
98
|
-
display: none
|
99
|
-
right: 0
|
100
|
-
top: 100%
|
101
|
-
position: absolute
|
102
|
-
.nav-item
|
103
|
-
border-top: 1px solid rgba($border, 0.5)
|
104
|
-
padding: 0.75rem
|
105
|
-
&.is-active
|
106
|
-
display: block
|
107
|
-
|
108
|
-
// Main container
|
109
|
-
|
110
|
-
.nav
|
111
|
-
align-items: stretch
|
112
|
-
background-color: $white
|
113
|
-
display: flex
|
114
|
-
height: $nav-height
|
115
|
-
position: relative
|
116
|
-
text-align: center
|
117
|
-
z-index: 10
|
118
|
-
& > .container
|
119
|
-
align-items: stretch
|
120
|
-
display: flex
|
121
|
-
min-height: $nav-height
|
122
|
-
width: 100%
|
123
|
-
// Modifiers
|
124
|
-
&.has-shadow
|
125
|
-
box-shadow: 0 2px 3px rgba($black, 0.1)
|
@@ -1,150 +0,0 @@
|
|
1
|
-
////////////////////////////////////////////////
|
2
|
-
////////////////////////////////////////////////
|
3
|
-
// 1. Initial variables
|
4
|
-
|
5
|
-
// Colors
|
6
|
-
$black: hsl(0, 0%, 4%) !default
|
7
|
-
$black-bis: hsl(0, 0%, 7%) !default
|
8
|
-
$black-ter: hsl(0, 0%, 14%) !default
|
9
|
-
|
10
|
-
$grey-darker: hsl(0, 0%, 21%) !default
|
11
|
-
$grey-dark: hsl(0, 0%, 29%) !default
|
12
|
-
$grey: hsl(0, 0%, 48%) !default
|
13
|
-
$grey-light: hsl(0, 0%, 71%) !default
|
14
|
-
$grey-lighter: hsl(0, 0%, 86%) !default
|
15
|
-
|
16
|
-
$white-ter: hsl(0, 0%, 96%) !default
|
17
|
-
$white-bis: hsl(0, 0%, 98%) !default
|
18
|
-
$white: hsl(0, 0%, 100%) !default
|
19
|
-
|
20
|
-
$orange: hsl(14, 100%, 53%) !default
|
21
|
-
$yellow: hsl(48, 100%, 67%) !default
|
22
|
-
$green: hsl(141, 71%, 48%) !default
|
23
|
-
$turquoise: hsl(171, 100%, 41%) !default
|
24
|
-
$blue: hsl(217, 71%, 53%) !default
|
25
|
-
$purple: hsl(271, 100%, 71%) !default
|
26
|
-
$red: hsl(348, 100%, 61%) !default
|
27
|
-
|
28
|
-
// Typography
|
29
|
-
$family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !default
|
30
|
-
$family-monospace: monospace !default
|
31
|
-
$render-mode: optimizeLegibility !default
|
32
|
-
|
33
|
-
$size-1: 3rem !default
|
34
|
-
$size-2: 2.5rem !default
|
35
|
-
$size-3: 2rem !default
|
36
|
-
$size-4: 1.5rem !default
|
37
|
-
$size-5: 1.25rem !default
|
38
|
-
$size-6: 1rem !default
|
39
|
-
$size-7: 0.75rem !default
|
40
|
-
|
41
|
-
$weight-light: 300 !default
|
42
|
-
$weight-normal: 400 !default
|
43
|
-
$weight-semibold: 500 !default
|
44
|
-
$weight-bold: 700 !default
|
45
|
-
|
46
|
-
// Body
|
47
|
-
$body-background: #fff !default
|
48
|
-
$body-size: 16px !default
|
49
|
-
|
50
|
-
// Responsiveness
|
51
|
-
// 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
|
52
|
-
$tablet: 769px !default
|
53
|
-
// 960px container + 40px
|
54
|
-
$desktop: 1000px !default
|
55
|
-
// 1152px container + 40
|
56
|
-
$widescreen: 1192px !default
|
57
|
-
// 1344px container + 40
|
58
|
-
$fullhd: 1384px !default
|
59
|
-
|
60
|
-
// Miscellaneous
|
61
|
-
$easing: ease-out !default
|
62
|
-
$radius-small: 2px !default
|
63
|
-
$radius: 3px !default
|
64
|
-
$radius-large: 5px !default
|
65
|
-
$speed: 86ms !default
|
66
|
-
|
67
|
-
////////////////////////////////////////////////
|
68
|
-
////////////////////////////////////////////////
|
69
|
-
// 2. Primary colors
|
70
|
-
|
71
|
-
$primary: $turquoise !default
|
72
|
-
|
73
|
-
$info: $blue !default
|
74
|
-
$success: $green !default
|
75
|
-
$warning: $yellow !default
|
76
|
-
$danger: $red !default
|
77
|
-
|
78
|
-
$light: $white-ter !default
|
79
|
-
$dark: $grey-darker !default
|
80
|
-
|
81
|
-
////////////////////////////////////////////////
|
82
|
-
////////////////////////////////////////////////
|
83
|
-
// 3. Applied variables
|
84
|
-
|
85
|
-
// Invert colors
|
86
|
-
$orange-invert: findColorInvert($orange) !default
|
87
|
-
$yellow-invert: findColorInvert($yellow) !default
|
88
|
-
$green-invert: findColorInvert($green) !default
|
89
|
-
$turquoise-invert: findColorInvert($turquoise) !default
|
90
|
-
$blue-invert: findColorInvert($blue) !default
|
91
|
-
$purple-invert: findColorInvert($purple) !default
|
92
|
-
$red-invert: findColorInvert($red) !default
|
93
|
-
|
94
|
-
$primary-invert: $turquoise-invert !default
|
95
|
-
$info-invert: $blue-invert !default
|
96
|
-
$success-invert: $green-invert !default
|
97
|
-
$warning-invert: $yellow-invert !default
|
98
|
-
$danger-invert: $red-invert !default
|
99
|
-
$light-invert: $dark !default
|
100
|
-
$dark-invert: $light !default
|
101
|
-
|
102
|
-
// General colors
|
103
|
-
$background: $white-ter !default
|
104
|
-
|
105
|
-
$border: $grey-lighter !default
|
106
|
-
$border-hover: $grey-light !default
|
107
|
-
|
108
|
-
// Text colors
|
109
|
-
$text: $grey-dark !default
|
110
|
-
$text-invert: findColorInvert($text) !default
|
111
|
-
$text-light: $grey !default
|
112
|
-
$text-strong: $grey-darker !default
|
113
|
-
|
114
|
-
// Code colors
|
115
|
-
$code: $red !default
|
116
|
-
$code-background: $background !default
|
117
|
-
|
118
|
-
$pre: $text !default
|
119
|
-
$pre-background: $background !default
|
120
|
-
|
121
|
-
// Link colors
|
122
|
-
$link: $primary !default
|
123
|
-
$link-invert: $primary-invert !default
|
124
|
-
$link-visited: $purple !default
|
125
|
-
|
126
|
-
$link-hover: $grey-darker !default
|
127
|
-
$link-hover-border: $grey-light !default
|
128
|
-
|
129
|
-
$link-focus: $grey-darker !default
|
130
|
-
$link-focus-border: $primary !default
|
131
|
-
|
132
|
-
$link-active: $grey-darker !default
|
133
|
-
$link-active-border: $grey-dark !default
|
134
|
-
|
135
|
-
// Typography
|
136
|
-
$family-primary: $family-sans-serif !default
|
137
|
-
$family-code: $family-monospace !default
|
138
|
-
|
139
|
-
$size-small: $size-7 !default
|
140
|
-
$size-normal: $size-6 !default
|
141
|
-
$size-medium: $size-5 !default
|
142
|
-
$size-large: $size-4 !default
|
143
|
-
|
144
|
-
////////////////////////////////////////////////
|
145
|
-
////////////////////////////////////////////////
|
146
|
-
// 4. Lists and maps
|
147
|
-
|
148
|
-
$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
|
149
|
-
|
150
|
-
$sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
|