bulma-sass 0.8.2 → 0.9.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (70) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/bulma.sass +2 -1
  3. data/app/assets/stylesheets/sass/base/_all.sass +4 -3
  4. data/app/assets/stylesheets/sass/base/animations.sass +5 -0
  5. data/app/assets/stylesheets/sass/base/generic.sass +4 -1
  6. data/app/assets/stylesheets/sass/base/helpers.sass +1 -281
  7. data/app/assets/stylesheets/sass/base/minireset.sass +1 -1
  8. data/app/assets/stylesheets/sass/components/_all.sass +13 -13
  9. data/app/assets/stylesheets/sass/components/breadcrumb.sass +5 -3
  10. data/app/assets/stylesheets/sass/components/card.sass +26 -2
  11. data/app/assets/stylesheets/sass/components/dropdown.sass +6 -4
  12. data/app/assets/stylesheets/sass/components/level.sass +5 -3
  13. data/app/assets/stylesheets/sass/components/media.sass +24 -15
  14. data/app/assets/stylesheets/sass/components/menu.sass +4 -2
  15. data/app/assets/stylesheets/sass/components/message.sass +3 -1
  16. data/app/assets/stylesheets/sass/components/modal.sass +7 -3
  17. data/app/assets/stylesheets/sass/components/navbar.sass +15 -10
  18. data/app/assets/stylesheets/sass/components/pagination.sass +19 -3
  19. data/app/assets/stylesheets/sass/components/panel.sass +5 -3
  20. data/app/assets/stylesheets/sass/components/tabs.sass +37 -12
  21. data/app/assets/stylesheets/sass/elements/_all.sass +13 -12
  22. data/app/assets/stylesheets/sass/elements/box.sass +3 -1
  23. data/app/assets/stylesheets/sass/elements/button.sass +33 -11
  24. data/app/assets/stylesheets/sass/elements/container.sass +12 -7
  25. data/app/assets/stylesheets/sass/elements/content.sass +9 -5
  26. data/app/assets/stylesheets/sass/elements/icon.sass +25 -0
  27. data/app/assets/stylesheets/sass/elements/image.sass +2 -0
  28. data/app/assets/stylesheets/sass/elements/notification.sass +12 -3
  29. data/app/assets/stylesheets/sass/elements/other.sass +2 -10
  30. data/app/assets/stylesheets/sass/elements/progress.sass +7 -1
  31. data/app/assets/stylesheets/sass/elements/table.sass +8 -2
  32. data/app/assets/stylesheets/sass/elements/tag.sass +29 -17
  33. data/app/assets/stylesheets/sass/elements/title.sass +2 -2
  34. data/app/assets/stylesheets/sass/form/_all.sass +7 -6
  35. data/app/assets/stylesheets/sass/form/checkbox-radio.sass +3 -2
  36. data/app/assets/stylesheets/sass/form/file.sass +7 -3
  37. data/app/assets/stylesheets/sass/form/input-textarea.sass +3 -1
  38. data/app/assets/stylesheets/sass/form/select.sass +7 -5
  39. data/app/assets/stylesheets/sass/form/shared.sass +5 -0
  40. data/app/assets/stylesheets/sass/form/tools.sass +21 -11
  41. data/app/assets/stylesheets/sass/grid/_all.sass +3 -2
  42. data/app/assets/stylesheets/sass/grid/columns.sass +93 -84
  43. data/app/assets/stylesheets/sass/grid/tiles.sass +3 -1
  44. data/app/assets/stylesheets/sass/helpers/_all.sass +12 -0
  45. data/app/assets/stylesheets/sass/helpers/color.sass +39 -0
  46. data/app/assets/stylesheets/sass/helpers/flexbox.sass +35 -0
  47. data/app/assets/stylesheets/sass/helpers/float.sass +10 -0
  48. data/app/assets/stylesheets/sass/helpers/other.sass +14 -0
  49. data/app/assets/stylesheets/sass/helpers/overflow.sass +2 -0
  50. data/app/assets/stylesheets/sass/helpers/position.sass +7 -0
  51. data/app/assets/stylesheets/sass/helpers/spacing.sass +31 -0
  52. data/app/assets/stylesheets/sass/helpers/typography.sass +103 -0
  53. data/app/assets/stylesheets/sass/helpers/visibility.sass +122 -0
  54. data/app/assets/stylesheets/sass/layout/_all.sass +4 -3
  55. data/app/assets/stylesheets/sass/layout/footer.sass +2 -0
  56. data/app/assets/stylesheets/sass/layout/hero.sass +12 -4
  57. data/app/assets/stylesheets/sass/layout/section.sass +6 -2
  58. data/app/assets/stylesheets/sass/utilities/_all.sass +7 -6
  59. data/app/assets/stylesheets/sass/utilities/animations.sass +1 -5
  60. data/app/assets/stylesheets/sass/utilities/controls.sass +2 -3
  61. data/app/assets/stylesheets/sass/utilities/derived-variables.sass +9 -1
  62. data/app/assets/stylesheets/sass/utilities/extends.sass +25 -0
  63. data/app/assets/stylesheets/sass/utilities/functions.sass +30 -4
  64. data/app/assets/stylesheets/sass/utilities/initial-variables.sass +6 -5
  65. data/app/assets/stylesheets/sass/utilities/mixins.sass +42 -23
  66. data/bulma-sass.gemspec +2 -2
  67. data/lib/bulma/sass/version.rb +1 -1
  68. data/release.sh +2 -2
  69. metadata +18 -7
  70. data/app/assets/stylesheets/sass/components/list.sass +0 -39
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: bd840e2020796065274fa1138b7012d9e0748cddde967fba0fa003584ad61029
4
- data.tar.gz: 590e6e1dc37d37874d98280d0f9dba7dc2a50b2c59491182d46af5e92e95db22
3
+ metadata.gz: 01cd29983a18ccfb9e876cbdaf048dd66e596c7b4b5e8776090a82a08e713ced
4
+ data.tar.gz: fab854391afb95ad300b981a7688f3cdd0eda2646bb122a4d9961f70c1b90bf4
5
5
  SHA512:
6
- metadata.gz: 1739be87d89b76492d0af162e9da21373060ce529207326fb72c5140338143ec50dcc82b0ab4c36358681c230091598af287ef211e336520dd170fbb58207e77
7
- data.tar.gz: 4860f7954139549927d7e85744d9e6cf5fe0b04541831d2218539d09769a419552494d25976ed54e79981e5dc5752eeab162e2837e4dd4cee3686226774fb7a4
6
+ metadata.gz: 64a089de1a519c4021c6fcd5e8b29bd7ee262c404bc1bcdaa73251ea64a8368a0f175c13bdbb00557eaa60f2062c49a7a2c8a816906686e0c98c01637e3eb785
7
+ data.tar.gz: 95a08d4e1362f8ef90216fabbc6b278d09a179b391f5aa9f077b77cf7bf022ce412320353043f13169939c216cde0eb02dd5402fcc121042a8e5126d51987ca6
@@ -1,9 +1,10 @@
1
1
  @charset "utf-8"
2
- /*! bulma.io v0.8.2 | MIT License | github.com/jgthms/bulma */
2
+ /*! bulma.io v0.9.3 | 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
6
  @import "sass/form/_all"
7
7
  @import "sass/components/_all"
8
8
  @import "sass/grid/_all"
9
+ @import "sass/helpers/_all"
9
10
  @import "sass/layout/_all"
@@ -1,5 +1,6 @@
1
+ /* Bulma Base */
1
2
  @charset "utf-8"
2
3
 
3
- @import "minireset.sass"
4
- @import "generic.sass"
5
- @import "helpers.sass"
4
+ @import "minireset"
5
+ @import "generic"
6
+ @import "animations"
@@ -0,0 +1,5 @@
1
+ @keyframes spinAround
2
+ from
3
+ transform: rotate(0deg)
4
+ to
5
+ transform: rotate(359deg)
@@ -1,3 +1,5 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $body-background-color: $scheme-main !default
2
4
  $body-size: 16px !default
3
5
  $body-min-width: 300px !default
@@ -52,6 +54,7 @@ section
52
54
  body,
53
55
  button,
54
56
  input,
57
+ optgroup,
55
58
  select,
56
59
  textarea
57
60
  font-family: $body-family
@@ -137,6 +140,6 @@ table
137
140
  th
138
141
  vertical-align: top
139
142
  &:not([align])
140
- text-align: left
143
+ text-align: inherit
141
144
  th
142
145
  color: $text-strong
@@ -1,281 +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: bulmaDarken($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-medium
119
- font-weight: $weight-medium !important
120
- .has-text-weight-semibold
121
- font-weight: $weight-semibold !important
122
- .has-text-weight-bold
123
- font-weight: $weight-bold !important
124
-
125
- .is-family-primary
126
- font-family: $family-primary !important
127
-
128
- .is-family-secondary
129
- font-family: $family-secondary !important
130
-
131
- .is-family-sans-serif
132
- font-family: $family-sans-serif !important
133
-
134
- .is-family-monospace
135
- font-family: $family-monospace !important
136
-
137
- .is-family-code
138
- font-family: $family-code !important
139
-
140
- // Visibility
141
-
142
- $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
143
-
144
- @each $display in $displays
145
- .is-#{$display}
146
- display: #{$display} !important
147
- +mobile
148
- .is-#{$display}-mobile
149
- display: #{$display} !important
150
- +tablet
151
- .is-#{$display}-tablet
152
- display: #{$display} !important
153
- +tablet-only
154
- .is-#{$display}-tablet-only
155
- display: #{$display} !important
156
- +touch
157
- .is-#{$display}-touch
158
- display: #{$display} !important
159
- +desktop
160
- .is-#{$display}-desktop
161
- display: #{$display} !important
162
- +desktop-only
163
- .is-#{$display}-desktop-only
164
- display: #{$display} !important
165
- +widescreen
166
- .is-#{$display}-widescreen
167
- display: #{$display} !important
168
- +widescreen-only
169
- .is-#{$display}-widescreen-only
170
- display: #{$display} !important
171
- +fullhd
172
- .is-#{$display}-fullhd
173
- display: #{$display} !important
174
-
175
- .is-hidden
176
- display: none !important
177
-
178
- .is-sr-only
179
- border: none !important
180
- clip: rect(0, 0, 0, 0) !important
181
- height: 0.01em !important
182
- overflow: hidden !important
183
- padding: 0 !important
184
- position: absolute !important
185
- white-space: nowrap !important
186
- width: 0.01em !important
187
-
188
- +mobile
189
- .is-hidden-mobile
190
- display: none !important
191
-
192
- +tablet
193
- .is-hidden-tablet
194
- display: none !important
195
-
196
- +tablet-only
197
- .is-hidden-tablet-only
198
- display: none !important
199
-
200
- +touch
201
- .is-hidden-touch
202
- display: none !important
203
-
204
- +desktop
205
- .is-hidden-desktop
206
- display: none !important
207
-
208
- +desktop-only
209
- .is-hidden-desktop-only
210
- display: none !important
211
-
212
- +widescreen
213
- .is-hidden-widescreen
214
- display: none !important
215
-
216
- +widescreen-only
217
- .is-hidden-widescreen-only
218
- display: none !important
219
-
220
- +fullhd
221
- .is-hidden-fullhd
222
- display: none !important
223
-
224
- .is-invisible
225
- visibility: hidden !important
226
-
227
- +mobile
228
- .is-invisible-mobile
229
- visibility: hidden !important
230
-
231
- +tablet
232
- .is-invisible-tablet
233
- visibility: hidden !important
234
-
235
- +tablet-only
236
- .is-invisible-tablet-only
237
- visibility: hidden !important
238
-
239
- +touch
240
- .is-invisible-touch
241
- visibility: hidden !important
242
-
243
- +desktop
244
- .is-invisible-desktop
245
- visibility: hidden !important
246
-
247
- +desktop-only
248
- .is-invisible-desktop-only
249
- visibility: hidden !important
250
-
251
- +widescreen
252
- .is-invisible-widescreen
253
- visibility: hidden !important
254
-
255
- +widescreen-only
256
- .is-invisible-widescreen-only
257
- visibility: hidden !important
258
-
259
- +fullhd
260
- .is-invisible-fullhd
261
- visibility: hidden !important
262
-
263
- // Other
264
-
265
- .is-marginless
266
- margin: 0 !important
267
-
268
- .is-paddingless
269
- padding: 0 !important
270
-
271
- .is-radiusless
272
- border-radius: 0 !important
273
-
274
- .is-shadowless
275
- box-shadow: none !important
276
-
277
- .is-unselectable
278
- @extend %unselectable
279
-
280
- .is-relative
281
- position: relative !important
1
+ @warn "The helpers.sass file is DEPRECATED. It has moved into its own /helpers folder. Please import sass/helpers/_all instead."
@@ -76,4 +76,4 @@ td,
76
76
  th
77
77
  padding: 0
78
78
  &:not([align])
79
- text-align: left
79
+ text-align: inherit
@@ -1,15 +1,15 @@
1
+ /* Bulma Components */
1
2
  @charset "utf-8"
2
3
 
3
- @import "breadcrumb.sass"
4
- @import "card.sass"
5
- @import "dropdown.sass"
6
- @import "level.sass"
7
- @import "list.sass"
8
- @import "media.sass"
9
- @import "menu.sass"
10
- @import "message.sass"
11
- @import "modal.sass"
12
- @import "navbar.sass"
13
- @import "pagination.sass"
14
- @import "panel.sass"
15
- @import "tabs.sass"
4
+ @import "breadcrumb"
5
+ @import "card"
6
+ @import "dropdown"
7
+ @import "level"
8
+ @import "media"
9
+ @import "menu"
10
+ @import "message"
11
+ @import "modal"
12
+ @import "navbar"
13
+ @import "pagination"
14
+ @import "panel"
15
+ @import "tabs"
@@ -1,3 +1,5 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $breadcrumb-item-color: $link !default
2
4
  $breadcrumb-item-hover-color: $link-hover !default
3
5
  $breadcrumb-item-active-color: $text-strong !default
@@ -24,7 +26,7 @@ $breadcrumb-item-separator-color: $border-hover !default
24
26
  align-items: center
25
27
  display: flex
26
28
  &:first-child a
27
- padding-left: 0
29
+ +ltr-property("padding", 0, false)
28
30
  &.is-active
29
31
  a
30
32
  color: $breadcrumb-item-active-color
@@ -41,9 +43,9 @@ $breadcrumb-item-separator-color: $border-hover !default
41
43
  justify-content: flex-start
42
44
  .icon
43
45
  &:first-child
44
- margin-right: 0.5em
46
+ +ltr-property("margin", 0.5em)
45
47
  &:last-child
46
- margin-left: 0.5em
48
+ +ltr-property("margin", 0.5em, false)
47
49
  // Alignment
48
50
  &.is-centered
49
51
  ol,
@@ -1,6 +1,9 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $card-color: $text !default
2
4
  $card-background-color: $scheme-main !default
3
- $card-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
5
+ $card-shadow: $shadow !default
6
+ $card-radius: 0.25rem !default
4
7
 
5
8
  $card-header-background-color: transparent !default
6
9
  $card-header-color: $text-strong !default
@@ -19,12 +22,22 @@ $card-media-margin: $block-spacing !default
19
22
 
20
23
  .card
21
24
  background-color: $card-background-color
25
+ border-radius: $card-radius
22
26
  box-shadow: $card-shadow
23
27
  color: $card-color
24
28
  max-width: 100%
25
29
  position: relative
26
30
 
31
+ %card-item
32
+ &:first-child
33
+ border-top-left-radius: $card-radius
34
+ border-top-right-radius: $card-radius
35
+ &:last-child
36
+ border-bottom-left-radius: $card-radius
37
+ border-bottom-right-radius: $card-radius
38
+
27
39
  .card-header
40
+ @extend %card-item
28
41
  background-color: $card-header-background-color
29
42
  align-items: stretch
30
43
  box-shadow: $card-header-shadow
@@ -41,6 +54,7 @@ $card-media-margin: $block-spacing !default
41
54
  justify-content: center
42
55
 
43
56
  .card-header-icon
57
+ +reset
44
58
  align-items: center
45
59
  cursor: pointer
46
60
  display: flex
@@ -50,12 +64,22 @@ $card-media-margin: $block-spacing !default
50
64
  .card-image
51
65
  display: block
52
66
  position: relative
67
+ &:first-child
68
+ img
69
+ border-top-left-radius: $card-radius
70
+ border-top-right-radius: $card-radius
71
+ &:last-child
72
+ img
73
+ border-bottom-left-radius: $card-radius
74
+ border-bottom-right-radius: $card-radius
53
75
 
54
76
  .card-content
77
+ @extend %card-item
55
78
  background-color: $card-content-background-color
56
79
  padding: $card-content-padding
57
80
 
58
81
  .card-footer
82
+ @extend %card-item
59
83
  background-color: $card-footer-background-color
60
84
  border-top: $card-footer-border-top
61
85
  align-items: stretch
@@ -70,7 +94,7 @@ $card-media-margin: $block-spacing !default
70
94
  justify-content: center
71
95
  padding: $card-footer-padding
72
96
  &:not(:last-child)
73
- border-right: $card-footer-border-top
97
+ +ltr-property("border", $card-footer-border-top)
74
98
 
75
99
  // Combinations
76
100
 
@@ -1,3 +1,5 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $dropdown-menu-min-width: 12rem !default
2
4
 
3
5
  $dropdown-content-background-color: $scheme-main !default
@@ -6,7 +8,7 @@ $dropdown-content-offset: 4px !default
6
8
  $dropdown-content-padding-bottom: 0.5rem !default
7
9
  $dropdown-content-padding-top: 0.5rem !default
8
10
  $dropdown-content-radius: $radius !default
9
- $dropdown-content-shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
11
+ $dropdown-content-shadow: $shadow !default
10
12
  $dropdown-content-z: 20 !default
11
13
 
12
14
  $dropdown-item-color: $text !default
@@ -38,7 +40,7 @@ $dropdown-divider-background-color: $border-light !default
38
40
 
39
41
  .dropdown-menu
40
42
  display: none
41
- left: 0
43
+ +ltr-position(0, false)
42
44
  min-width: $dropdown-menu-min-width
43
45
  padding-top: $dropdown-content-offset
44
46
  position: absolute
@@ -62,8 +64,8 @@ $dropdown-divider-background-color: $border-light !default
62
64
 
63
65
  a.dropdown-item,
64
66
  button.dropdown-item
65
- padding-right: 3rem
66
- text-align: left
67
+ +ltr-property("padding", 3rem)
68
+ text-align: inherit
67
69
  white-space: nowrap
68
70
  width: 100%
69
71
  &:hover
@@ -1,4 +1,6 @@
1
- $level-item-spacing: ($block-spacing / 2) !default
1
+ @import "../utilities/mixins"
2
+
3
+ $level-item-spacing: ($block-spacing * 0.5) !default
2
4
 
3
5
  .level
4
6
  @extend %block
@@ -20,7 +22,7 @@ $level-item-spacing: ($block-spacing / 2) !default
20
22
  .level-item
21
23
  &:not(:last-child)
22
24
  margin-bottom: 0
23
- margin-right: $level-item-spacing
25
+ +ltr-property("margin", $level-item-spacing)
24
26
  &:not(.is-narrow)
25
27
  flex-grow: 1
26
28
  // Responsiveness
@@ -57,7 +59,7 @@ $level-item-spacing: ($block-spacing / 2) !default
57
59
  // Responsiveness
58
60
  +tablet
59
61
  &:not(:last-child)
60
- margin-right: $level-item-spacing
62
+ +ltr-property("margin", $level-item-spacing)
61
63
 
62
64
  .level-left
63
65
  align-items: center
@@ -1,31 +1,40 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $media-border-color: bulmaRgba($border, 0.5) !default
4
+ $media-border-size: 1px !default
5
+ $media-spacing: 1rem !default
6
+ $media-spacing-large: 1.5rem !default
7
+ $media-content-spacing: 0.75rem !default
8
+ $media-level-1-spacing: 0.75rem !default
9
+ $media-level-1-content-spacing: 0.5rem !default
10
+ $media-level-2-spacing: 0.5rem !default
2
11
 
3
12
  .media
4
13
  align-items: flex-start
5
14
  display: flex
6
- text-align: left
15
+ text-align: inherit
7
16
  .content:not(:last-child)
8
- margin-bottom: 0.75rem
17
+ margin-bottom: $media-content-spacing
9
18
  .media
10
- border-top: 1px solid $media-border-color
19
+ border-top: $media-border-size solid $media-border-color
11
20
  display: flex
12
- padding-top: 0.75rem
21
+ padding-top: $media-level-1-spacing
13
22
  .content:not(:last-child),
14
23
  .control:not(:last-child)
15
- margin-bottom: 0.5rem
24
+ margin-bottom: $media-level-1-content-spacing
16
25
  .media
17
- padding-top: 0.5rem
26
+ padding-top: $media-level-2-spacing
18
27
  & + .media
19
- margin-top: 0.5rem
28
+ margin-top: $media-level-2-spacing
20
29
  & + .media
21
- border-top: 1px solid $media-border-color
22
- margin-top: 1rem
23
- padding-top: 1rem
30
+ border-top: $media-border-size solid $media-border-color
31
+ margin-top: $media-spacing
32
+ padding-top: $media-spacing
24
33
  // Sizes
25
34
  &.is-large
26
35
  & + .media
27
- margin-top: 1.5rem
28
- padding-top: 1.5rem
36
+ margin-top: $media-spacing-large
37
+ padding-top: $media-spacing-large
29
38
 
30
39
  .media-left,
31
40
  .media-right
@@ -34,16 +43,16 @@ $media-border-color: bulmaRgba($border, 0.5) !default
34
43
  flex-shrink: 0
35
44
 
36
45
  .media-left
37
- margin-right: 1rem
46
+ +ltr-property("margin", $media-spacing)
38
47
 
39
48
  .media-right
40
- margin-left: 1rem
49
+ +ltr-property("margin", $media-spacing, false)
41
50
 
42
51
  .media-content
43
52
  flex-basis: auto
44
53
  flex-grow: 1
45
54
  flex-shrink: 1
46
- text-align: left
55
+ text-align: inherit
47
56
 
48
57
  +mobile
49
58
  .media-content
@@ -1,3 +1,5 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $menu-item-color: $text !default
2
4
  $menu-item-radius: $radius-small !default
3
5
  $menu-item-hover-color: $text-strong !default
@@ -42,9 +44,9 @@ $menu-label-spacing: 1em !default
42
44
  color: $menu-item-active-color
43
45
  li
44
46
  ul
45
- border-left: $menu-list-border-left
47
+ +ltr-property("border", $menu-list-border-left, false)
46
48
  margin: $menu-nested-list-margin
47
- padding-left: $menu-nested-list-padding-left
49
+ +ltr-property("padding", $menu-nested-list-padding-left, false)
48
50
 
49
51
  .menu-label
50
52
  color: $menu-label-color
@@ -1,3 +1,5 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $message-background-color: $background !default
2
4
  $message-radius: $radius !default
3
5
 
@@ -79,7 +81,7 @@ $message-colors: $colors !default
79
81
  .delete
80
82
  flex-grow: 0
81
83
  flex-shrink: 0
82
- margin-left: 0.75em
84
+ +ltr-property("margin", 0.75em, false)
83
85
  & + .message-body
84
86
  border-width: $message-header-body-border-width
85
87
  border-top-left-radius: 0
@@ -1,3 +1,5 @@
1
+ @import "../utilities/mixins"
2
+
1
3
  $modal-z: 40 !default
2
4
 
3
5
  $modal-background-background-color: bulmaRgba($scheme-invert, 0.86) !default
@@ -28,6 +30,8 @@ $modal-card-foot-border-top: 1px solid $border !default
28
30
  $modal-card-body-background-color: $scheme-main !default
29
31
  $modal-card-body-padding: 20px !default
30
32
 
33
+ $modal-breakpoint: $tablet !default
34
+
31
35
  .modal
32
36
  @extend %overlay
33
37
  align-items: center
@@ -53,7 +57,7 @@ $modal-card-body-padding: 20px !default
53
57
  position: relative
54
58
  width: 100%
55
59
  // Responsiveness
56
- +tablet
60
+ +from($modal-breakpoint)
57
61
  margin: 0 auto
58
62
  max-height: calc(100vh - #{$modal-content-spacing-tablet})
59
63
  width: $modal-content-width
@@ -63,7 +67,7 @@ $modal-card-body-padding: 20px !default
63
67
  background: none
64
68
  height: $modal-close-dimensions
65
69
  position: fixed
66
- right: $modal-close-right
70
+ +ltr-position($modal-close-right)
67
71
  top: $modal-close-top
68
72
  width: $modal-close-dimensions
69
73
 
@@ -102,7 +106,7 @@ $modal-card-body-padding: 20px !default
102
106
  border-top: $modal-card-foot-border-top
103
107
  .button
104
108
  &:not(:last-child)
105
- margin-right: 0.5em
109
+ +ltr-property("margin", 0.5em)
106
110
 
107
111
  .modal-card-body
108
112
  +overflow-touch