bulma-rails 0.9.4 → 1.0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (143) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +74 -13
  3. data/app/assets/stylesheets/bulma.scss +4 -0
  4. data/app/assets/stylesheets/sass/_index.scss +10 -0
  5. data/app/assets/stylesheets/sass/base/_index.scss +6 -0
  6. data/app/assets/stylesheets/sass/base/animations.scss +15 -0
  7. data/app/assets/stylesheets/sass/base/generic.scss +239 -0
  8. data/app/assets/stylesheets/sass/base/minireset.scss +92 -0
  9. data/app/assets/stylesheets/sass/base/skeleton.scss +114 -0
  10. data/app/assets/stylesheets/sass/components/_index.scss +13 -0
  11. data/app/assets/stylesheets/sass/components/breadcrumb.scss +139 -0
  12. data/app/assets/stylesheets/sass/components/card.scss +162 -0
  13. data/app/assets/stylesheets/sass/components/dropdown.scss +188 -0
  14. data/app/assets/stylesheets/sass/components/menu.scss +165 -0
  15. data/app/assets/stylesheets/sass/components/message.scss +183 -0
  16. data/app/assets/stylesheets/sass/components/modal.scss +164 -0
  17. data/app/assets/stylesheets/sass/components/navbar.scss +799 -0
  18. data/app/assets/stylesheets/sass/components/pagination.scss +379 -0
  19. data/app/assets/stylesheets/sass/components/panel.scss +218 -0
  20. data/app/assets/stylesheets/sass/components/tabs.scss +273 -0
  21. data/app/assets/stylesheets/sass/elements/_index.scss +16 -0
  22. data/app/assets/stylesheets/sass/elements/block.scss +6 -0
  23. data/app/assets/stylesheets/sass/elements/box.scss +59 -0
  24. data/app/assets/stylesheets/sass/elements/button.scss +647 -0
  25. data/app/assets/stylesheets/sass/elements/content.scss +289 -0
  26. data/app/assets/stylesheets/sass/elements/delete.scss +6 -0
  27. data/app/assets/stylesheets/sass/elements/icon.scss +67 -0
  28. data/app/assets/stylesheets/sass/elements/image.scss +62 -0
  29. data/app/assets/stylesheets/sass/elements/loader.scss +15 -0
  30. data/app/assets/stylesheets/sass/elements/notification.scss +105 -0
  31. data/app/assets/stylesheets/sass/elements/progress.scss +115 -0
  32. data/app/assets/stylesheets/sass/elements/table.scss +261 -0
  33. data/app/assets/stylesheets/sass/elements/tag.scss +219 -0
  34. data/app/assets/stylesheets/sass/elements/title.scss +128 -0
  35. data/app/assets/stylesheets/sass/form/_index.scss +9 -0
  36. data/app/assets/stylesheets/sass/form/checkbox-radio.scss +36 -0
  37. data/app/assets/stylesheets/sass/form/file.scss +330 -0
  38. data/app/assets/stylesheets/sass/form/input-textarea.scss +113 -0
  39. data/app/assets/stylesheets/sass/form/select.scss +144 -0
  40. data/app/assets/stylesheets/sass/form/shared.scss +176 -0
  41. data/app/assets/stylesheets/sass/form/tools.scss +352 -0
  42. data/app/assets/stylesheets/sass/grid/_index.scss +5 -0
  43. data/app/assets/stylesheets/sass/grid/columns.scss +961 -0
  44. data/app/assets/stylesheets/sass/grid/grid.scss +209 -0
  45. data/app/assets/stylesheets/sass/helpers/_index.scss +15 -0
  46. data/app/assets/stylesheets/sass/helpers/aspect-ratio.scss +10 -0
  47. data/app/assets/stylesheets/sass/helpers/border.scss +15 -0
  48. data/app/assets/stylesheets/sass/helpers/color.scss +344 -0
  49. data/app/assets/stylesheets/sass/helpers/flexbox.scss +62 -0
  50. data/app/assets/stylesheets/sass/helpers/float.scss +28 -0
  51. data/app/assets/stylesheets/sass/helpers/gap.scss +24 -0
  52. data/app/assets/stylesheets/sass/helpers/other.scss +19 -0
  53. data/app/assets/stylesheets/sass/helpers/overflow.scss +21 -0
  54. data/app/assets/stylesheets/sass/helpers/position.scss +19 -0
  55. data/app/assets/stylesheets/sass/helpers/spacing.scss +64 -0
  56. data/app/assets/stylesheets/sass/helpers/typography.scss +168 -0
  57. data/app/assets/stylesheets/sass/helpers/visibility.scss +221 -0
  58. data/app/assets/stylesheets/sass/layout/_index.scss +9 -0
  59. data/app/assets/stylesheets/sass/layout/container.scss +59 -0
  60. data/app/assets/stylesheets/sass/layout/footer.scss +23 -0
  61. data/app/assets/stylesheets/sass/layout/hero.scss +270 -0
  62. data/app/assets/stylesheets/sass/layout/level.scss +107 -0
  63. data/app/assets/stylesheets/sass/layout/media.scss +106 -0
  64. data/app/assets/stylesheets/sass/layout/section.scss +38 -0
  65. data/app/assets/stylesheets/sass/themes/_index.scss +35 -0
  66. data/app/assets/stylesheets/sass/themes/dark.scss +56 -0
  67. data/app/assets/stylesheets/sass/themes/light.scss +146 -0
  68. data/app/assets/stylesheets/sass/themes/setup.scss +174 -0
  69. data/app/assets/stylesheets/sass/utilities/_index.scss +7 -0
  70. data/app/assets/stylesheets/sass/utilities/controls.scss +85 -0
  71. data/app/assets/stylesheets/sass/utilities/css-variables.scss +426 -0
  72. data/app/assets/stylesheets/sass/utilities/derived-variables.scss +112 -0
  73. data/app/assets/stylesheets/sass/utilities/extends.scss +34 -0
  74. data/app/assets/stylesheets/sass/utilities/functions.scss +258 -0
  75. data/app/assets/stylesheets/sass/utilities/initial-variables.scss +155 -0
  76. data/app/assets/stylesheets/sass/utilities/mixins.scss +460 -0
  77. data/bulma-rails.gemspec +4 -6
  78. metadata +83 -74
  79. data/app/assets/stylesheets/bulma.sass +0 -10
  80. data/app/assets/stylesheets/sass/base/_all.sass +0 -6
  81. data/app/assets/stylesheets/sass/base/animations.sass +0 -5
  82. data/app/assets/stylesheets/sass/base/generic.sass +0 -145
  83. data/app/assets/stylesheets/sass/base/helpers.sass +0 -1
  84. data/app/assets/stylesheets/sass/base/minireset.sass +0 -79
  85. data/app/assets/stylesheets/sass/components/_all.sass +0 -15
  86. data/app/assets/stylesheets/sass/components/breadcrumb.sass +0 -77
  87. data/app/assets/stylesheets/sass/components/card.sass +0 -103
  88. data/app/assets/stylesheets/sass/components/dropdown.sass +0 -83
  89. data/app/assets/stylesheets/sass/components/level.sass +0 -79
  90. data/app/assets/stylesheets/sass/components/media.sass +0 -59
  91. data/app/assets/stylesheets/sass/components/menu.sass +0 -59
  92. data/app/assets/stylesheets/sass/components/message.sass +0 -101
  93. data/app/assets/stylesheets/sass/components/modal.sass +0 -117
  94. data/app/assets/stylesheets/sass/components/navbar.sass +0 -446
  95. data/app/assets/stylesheets/sass/components/pagination.sass +0 -167
  96. data/app/assets/stylesheets/sass/components/panel.sass +0 -121
  97. data/app/assets/stylesheets/sass/components/tabs.sass +0 -176
  98. data/app/assets/stylesheets/sass/elements/_all.sass +0 -16
  99. data/app/assets/stylesheets/sass/elements/box.sass +0 -26
  100. data/app/assets/stylesheets/sass/elements/button.sass +0 -357
  101. data/app/assets/stylesheets/sass/elements/container.sass +0 -29
  102. data/app/assets/stylesheets/sass/elements/content.sass +0 -162
  103. data/app/assets/stylesheets/sass/elements/form.sass +0 -1
  104. data/app/assets/stylesheets/sass/elements/icon.sass +0 -46
  105. data/app/assets/stylesheets/sass/elements/image.sass +0 -73
  106. data/app/assets/stylesheets/sass/elements/notification.sass +0 -52
  107. data/app/assets/stylesheets/sass/elements/other.sass +0 -31
  108. data/app/assets/stylesheets/sass/elements/progress.sass +0 -73
  109. data/app/assets/stylesheets/sass/elements/table.sass +0 -134
  110. data/app/assets/stylesheets/sass/elements/tag.sass +0 -140
  111. data/app/assets/stylesheets/sass/elements/title.sass +0 -70
  112. data/app/assets/stylesheets/sass/form/_all.sass +0 -9
  113. data/app/assets/stylesheets/sass/form/checkbox-radio.sass +0 -22
  114. data/app/assets/stylesheets/sass/form/file.sass +0 -184
  115. data/app/assets/stylesheets/sass/form/input-textarea.sass +0 -66
  116. data/app/assets/stylesheets/sass/form/select.sass +0 -88
  117. data/app/assets/stylesheets/sass/form/shared.sass +0 -60
  118. data/app/assets/stylesheets/sass/form/tools.sass +0 -215
  119. data/app/assets/stylesheets/sass/grid/_all.sass +0 -5
  120. data/app/assets/stylesheets/sass/grid/columns.sass +0 -513
  121. data/app/assets/stylesheets/sass/grid/tiles.sass +0 -36
  122. data/app/assets/stylesheets/sass/helpers/_all.sass +0 -12
  123. data/app/assets/stylesheets/sass/helpers/color.sass +0 -39
  124. data/app/assets/stylesheets/sass/helpers/flexbox.sass +0 -35
  125. data/app/assets/stylesheets/sass/helpers/float.sass +0 -10
  126. data/app/assets/stylesheets/sass/helpers/other.sass +0 -14
  127. data/app/assets/stylesheets/sass/helpers/overflow.sass +0 -2
  128. data/app/assets/stylesheets/sass/helpers/position.sass +0 -7
  129. data/app/assets/stylesheets/sass/helpers/spacing.sass +0 -31
  130. data/app/assets/stylesheets/sass/helpers/typography.sass +0 -103
  131. data/app/assets/stylesheets/sass/helpers/visibility.sass +0 -122
  132. data/app/assets/stylesheets/sass/layout/_all.sass +0 -6
  133. data/app/assets/stylesheets/sass/layout/footer.sass +0 -11
  134. data/app/assets/stylesheets/sass/layout/hero.sass +0 -153
  135. data/app/assets/stylesheets/sass/layout/section.sass +0 -17
  136. data/app/assets/stylesheets/sass/utilities/_all.sass +0 -9
  137. data/app/assets/stylesheets/sass/utilities/animations.sass +0 -1
  138. data/app/assets/stylesheets/sass/utilities/controls.sass +0 -49
  139. data/app/assets/stylesheets/sass/utilities/derived-variables.sass +0 -114
  140. data/app/assets/stylesheets/sass/utilities/extends.sass +0 -25
  141. data/app/assets/stylesheets/sass/utilities/functions.sass +0 -135
  142. data/app/assets/stylesheets/sass/utilities/initial-variables.sass +0 -79
  143. data/app/assets/stylesheets/sass/utilities/mixins.sass +0 -303
@@ -1,184 +0,0 @@
1
- $file-border-color: $border !default
2
- $file-radius: $radius !default
3
-
4
- $file-cta-background-color: $scheme-main-ter !default
5
- $file-cta-color: $text !default
6
- $file-cta-hover-color: $text-strong !default
7
- $file-cta-active-color: $text-strong !default
8
-
9
- $file-name-border-color: $border !default
10
- $file-name-border-style: solid !default
11
- $file-name-border-width: 1px 1px 1px 0 !default
12
- $file-name-max-width: 16em !default
13
-
14
- $file-colors: $form-colors !default
15
-
16
- .file
17
- @extend %unselectable
18
- align-items: stretch
19
- display: flex
20
- justify-content: flex-start
21
- position: relative
22
- // Colors
23
- @each $name, $pair in $file-colors
24
- $color: nth($pair, 1)
25
- $color-invert: nth($pair, 2)
26
- &.is-#{$name}
27
- .file-cta
28
- background-color: $color
29
- border-color: transparent
30
- color: $color-invert
31
- &:hover,
32
- &.is-hovered
33
- .file-cta
34
- background-color: bulmaDarken($color, 2.5%)
35
- border-color: transparent
36
- color: $color-invert
37
- &:focus,
38
- &.is-focused
39
- .file-cta
40
- border-color: transparent
41
- box-shadow: 0 0 0.5em bulmaRgba($color, 0.25)
42
- color: $color-invert
43
- &:active,
44
- &.is-active
45
- .file-cta
46
- background-color: bulmaDarken($color, 5%)
47
- border-color: transparent
48
- color: $color-invert
49
- // Sizes
50
- &.is-small
51
- font-size: $size-small
52
- &.is-normal
53
- font-size: $size-normal
54
- &.is-medium
55
- font-size: $size-medium
56
- .file-icon
57
- .fa
58
- font-size: 21px
59
- &.is-large
60
- font-size: $size-large
61
- .file-icon
62
- .fa
63
- font-size: 28px
64
- // Modifiers
65
- &.has-name
66
- .file-cta
67
- border-bottom-right-radius: 0
68
- border-top-right-radius: 0
69
- .file-name
70
- border-bottom-left-radius: 0
71
- border-top-left-radius: 0
72
- &.is-empty
73
- .file-cta
74
- border-radius: $file-radius
75
- .file-name
76
- display: none
77
- &.is-boxed
78
- .file-label
79
- flex-direction: column
80
- .file-cta
81
- flex-direction: column
82
- height: auto
83
- padding: 1em 3em
84
- .file-name
85
- border-width: 0 1px 1px
86
- .file-icon
87
- height: 1.5em
88
- width: 1.5em
89
- .fa
90
- font-size: 21px
91
- &.is-small
92
- .file-icon .fa
93
- font-size: 14px
94
- &.is-medium
95
- .file-icon .fa
96
- font-size: 28px
97
- &.is-large
98
- .file-icon .fa
99
- font-size: 35px
100
- &.has-name
101
- .file-cta
102
- border-radius: $file-radius $file-radius 0 0
103
- .file-name
104
- border-radius: 0 0 $file-radius $file-radius
105
- border-width: 0 1px 1px
106
- &.is-centered
107
- justify-content: center
108
- &.is-fullwidth
109
- .file-label
110
- width: 100%
111
- .file-name
112
- flex-grow: 1
113
- max-width: none
114
- &.is-right
115
- justify-content: flex-end
116
- .file-cta
117
- border-radius: 0 $file-radius $file-radius 0
118
- .file-name
119
- border-radius: $file-radius 0 0 $file-radius
120
- border-width: 1px 0 1px 1px
121
- order: -1
122
-
123
- .file-label
124
- align-items: stretch
125
- display: flex
126
- cursor: pointer
127
- justify-content: flex-start
128
- overflow: hidden
129
- position: relative
130
- &:hover
131
- .file-cta
132
- background-color: bulmaDarken($file-cta-background-color, 2.5%)
133
- color: $file-cta-hover-color
134
- .file-name
135
- border-color: bulmaDarken($file-name-border-color, 2.5%)
136
- &:active
137
- .file-cta
138
- background-color: bulmaDarken($file-cta-background-color, 5%)
139
- color: $file-cta-active-color
140
- .file-name
141
- border-color: bulmaDarken($file-name-border-color, 5%)
142
-
143
- .file-input
144
- height: 100%
145
- left: 0
146
- opacity: 0
147
- outline: none
148
- position: absolute
149
- top: 0
150
- width: 100%
151
-
152
- .file-cta,
153
- .file-name
154
- @extend %control
155
- border-color: $file-border-color
156
- border-radius: $file-radius
157
- font-size: 1em
158
- padding-left: 1em
159
- padding-right: 1em
160
- white-space: nowrap
161
-
162
- .file-cta
163
- background-color: $file-cta-background-color
164
- color: $file-cta-color
165
-
166
- .file-name
167
- border-color: $file-name-border-color
168
- border-style: $file-name-border-style
169
- border-width: $file-name-border-width
170
- display: block
171
- max-width: $file-name-max-width
172
- overflow: hidden
173
- text-align: inherit
174
- text-overflow: ellipsis
175
-
176
- .file-icon
177
- align-items: center
178
- display: flex
179
- height: 1em
180
- justify-content: center
181
- +ltr-property("margin", 0.5em)
182
- width: 1em
183
- .fa
184
- font-size: 14px
@@ -1,66 +0,0 @@
1
- $textarea-padding: $control-padding-horizontal !default
2
- $textarea-max-height: 40em !default
3
- $textarea-min-height: 8em !default
4
-
5
- $textarea-colors: $form-colors !default
6
-
7
- %input-textarea
8
- @extend %input
9
- box-shadow: $input-shadow
10
- max-width: 100%
11
- width: 100%
12
- &[readonly]
13
- box-shadow: none
14
- // Colors
15
- @each $name, $pair in $textarea-colors
16
- $color: nth($pair, 1)
17
- &.is-#{$name}
18
- border-color: $color
19
- &:focus,
20
- &.is-focused,
21
- &:active,
22
- &.is-active
23
- box-shadow: $input-focus-box-shadow-size bulmaRgba($color, 0.25)
24
- // Sizes
25
- &.is-small
26
- +control-small
27
- &.is-medium
28
- +control-medium
29
- &.is-large
30
- +control-large
31
- // Modifiers
32
- &.is-fullwidth
33
- display: block
34
- width: 100%
35
- &.is-inline
36
- display: inline
37
- width: auto
38
-
39
- .input
40
- @extend %input-textarea
41
- &.is-rounded
42
- border-radius: $radius-rounded
43
- padding-left: calc(#{$control-padding-horizontal} + 0.375em)
44
- padding-right: calc(#{$control-padding-horizontal} + 0.375em)
45
- &.is-static
46
- background-color: transparent
47
- border-color: transparent
48
- box-shadow: none
49
- padding-left: 0
50
- padding-right: 0
51
-
52
- .textarea
53
- @extend %input-textarea
54
- display: block
55
- max-width: 100%
56
- min-width: 100%
57
- padding: $textarea-padding
58
- resize: vertical
59
- &:not([rows])
60
- max-height: $textarea-max-height
61
- min-height: $textarea-min-height
62
- &[rows]
63
- height: initial
64
- // Modifiers
65
- &.has-fixed-size
66
- resize: none
@@ -1,88 +0,0 @@
1
- $select-colors: $form-colors !default
2
-
3
- .select
4
- display: inline-block
5
- max-width: 100%
6
- position: relative
7
- vertical-align: top
8
- &:not(.is-multiple)
9
- height: $input-height
10
- &:not(.is-multiple):not(.is-loading)
11
- &::after
12
- @extend %arrow
13
- border-color: $input-arrow
14
- +ltr-position(1.125em)
15
- z-index: 4
16
- &.is-rounded
17
- select
18
- border-radius: $radius-rounded
19
- +ltr-property("padding", 1em, false)
20
- select
21
- @extend %input
22
- cursor: pointer
23
- display: block
24
- font-size: 1em
25
- max-width: 100%
26
- outline: none
27
- &::-ms-expand
28
- display: none
29
- &[disabled]:hover,
30
- fieldset[disabled] &:hover
31
- border-color: $input-disabled-border-color
32
- &:not([multiple])
33
- +ltr-property("padding", 2.5em)
34
- &[multiple]
35
- height: auto
36
- padding: 0
37
- option
38
- padding: 0.5em 1em
39
- // States
40
- &:not(.is-multiple):not(.is-loading):hover
41
- &::after
42
- border-color: $input-hover-color
43
- // Colors
44
- @each $name, $pair in $select-colors
45
- $color: nth($pair, 1)
46
- &.is-#{$name}
47
- &:not(:hover)::after
48
- border-color: $color
49
- select
50
- border-color: $color
51
- &:hover,
52
- &.is-hovered
53
- border-color: bulmaDarken($color, 5%)
54
- &:focus,
55
- &.is-focused,
56
- &:active,
57
- &.is-active
58
- box-shadow: $input-focus-box-shadow-size bulmaRgba($color, 0.25)
59
- // Sizes
60
- &.is-small
61
- +control-small
62
- &.is-medium
63
- +control-medium
64
- &.is-large
65
- +control-large
66
- // Modifiers
67
- &.is-disabled
68
- &::after
69
- border-color: $input-disabled-color !important
70
- opacity: 0.5
71
- &.is-fullwidth
72
- width: 100%
73
- select
74
- width: 100%
75
- &.is-loading
76
- &::after
77
- @extend %loader
78
- margin-top: 0
79
- position: absolute
80
- +ltr-position(0.625em)
81
- top: 0.625em
82
- transform: none
83
- &.is-small:after
84
- font-size: $size-small
85
- &.is-medium:after
86
- font-size: $size-medium
87
- &.is-large:after
88
- font-size: $size-large
@@ -1,60 +0,0 @@
1
- @import "../utilities/controls"
2
- @import "../utilities/mixins"
3
-
4
- $form-colors: $colors !default
5
-
6
- $input-color: $text-strong !default
7
- $input-background-color: $scheme-main !default
8
- $input-border-color: $border !default
9
- $input-height: $control-height !default
10
- $input-shadow: inset 0 0.0625em 0.125em rgba($scheme-invert, 0.05) !default
11
- $input-placeholder-color: bulmaRgba($input-color, 0.3) !default
12
-
13
- $input-hover-color: $text-strong !default
14
- $input-hover-border-color: $border-hover !default
15
-
16
- $input-focus-color: $text-strong !default
17
- $input-focus-border-color: $link !default
18
- $input-focus-box-shadow-size: 0 0 0 0.125em !default
19
- $input-focus-box-shadow-color: bulmaRgba($link, 0.25) !default
20
-
21
- $input-disabled-color: $text-light !default
22
- $input-disabled-background-color: $background !default
23
- $input-disabled-border-color: $background !default
24
- $input-disabled-placeholder-color: bulmaRgba($input-disabled-color, 0.3) !default
25
-
26
- $input-arrow: $link !default
27
-
28
- $input-icon-color: $border !default
29
- $input-icon-active-color: $text !default
30
-
31
- $input-radius: $radius !default
32
-
33
- =input
34
- @extend %control
35
- background-color: $input-background-color
36
- border-color: $input-border-color
37
- border-radius: $input-radius
38
- color: $input-color
39
- +placeholder
40
- color: $input-placeholder-color
41
- &:hover,
42
- &.is-hovered
43
- border-color: $input-hover-border-color
44
- &:focus,
45
- &.is-focused,
46
- &:active,
47
- &.is-active
48
- border-color: $input-focus-border-color
49
- box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color
50
- &[disabled],
51
- fieldset[disabled] &
52
- background-color: $input-disabled-background-color
53
- border-color: $input-disabled-border-color
54
- box-shadow: none
55
- color: $input-disabled-color
56
- +placeholder
57
- color: $input-disabled-placeholder-color
58
-
59
- %input
60
- +input
@@ -1,215 +0,0 @@
1
- $label-color: $text-strong !default
2
- $label-weight: $weight-bold !default
3
-
4
- $help-size: $size-small !default
5
-
6
- $label-colors: $form-colors !default
7
-
8
- .label
9
- color: $label-color
10
- display: block
11
- font-size: $size-normal
12
- font-weight: $label-weight
13
- &:not(:last-child)
14
- margin-bottom: 0.5em
15
- // Sizes
16
- &.is-small
17
- font-size: $size-small
18
- &.is-medium
19
- font-size: $size-medium
20
- &.is-large
21
- font-size: $size-large
22
-
23
- .help
24
- display: block
25
- font-size: $help-size
26
- margin-top: 0.25rem
27
- @each $name, $pair in $label-colors
28
- $color: nth($pair, 1)
29
- &.is-#{$name}
30
- color: $color
31
-
32
- // Containers
33
-
34
- .field
35
- &:not(:last-child)
36
- margin-bottom: 0.75rem
37
- // Modifiers
38
- &.has-addons
39
- display: flex
40
- justify-content: flex-start
41
- .control
42
- &:not(:last-child)
43
- +ltr-property("margin", -1px)
44
- &:not(:first-child):not(:last-child)
45
- .button,
46
- .input,
47
- .select select
48
- border-radius: 0
49
- &:first-child:not(:only-child)
50
- .button,
51
- .input,
52
- .select select
53
- +ltr
54
- border-bottom-right-radius: 0
55
- border-top-right-radius: 0
56
- +rtl
57
- border-bottom-left-radius: 0
58
- border-top-left-radius: 0
59
- &:last-child:not(:only-child)
60
- .button,
61
- .input,
62
- .select select
63
- +ltr
64
- border-bottom-left-radius: 0
65
- border-top-left-radius: 0
66
- +rtl
67
- border-bottom-right-radius: 0
68
- border-top-right-radius: 0
69
- .button,
70
- .input,
71
- .select select
72
- &:not([disabled])
73
- &:hover,
74
- &.is-hovered
75
- z-index: 2
76
- &:focus,
77
- &.is-focused,
78
- &:active,
79
- &.is-active
80
- z-index: 3
81
- &:hover
82
- z-index: 4
83
- &.is-expanded
84
- flex-grow: 1
85
- flex-shrink: 1
86
- &.has-addons-centered
87
- justify-content: center
88
- &.has-addons-right
89
- justify-content: flex-end
90
- &.has-addons-fullwidth
91
- .control
92
- flex-grow: 1
93
- flex-shrink: 0
94
- &.is-grouped
95
- display: flex
96
- justify-content: flex-start
97
- & > .control
98
- flex-shrink: 0
99
- &:not(:last-child)
100
- margin-bottom: 0
101
- +ltr-property("margin", 0.75rem)
102
- &.is-expanded
103
- flex-grow: 1
104
- flex-shrink: 1
105
- &.is-grouped-centered
106
- justify-content: center
107
- &.is-grouped-right
108
- justify-content: flex-end
109
- &.is-grouped-multiline
110
- flex-wrap: wrap
111
- & > .control
112
- &:last-child,
113
- &:not(:last-child)
114
- margin-bottom: 0.75rem
115
- &:last-child
116
- margin-bottom: -0.75rem
117
- &:not(:last-child)
118
- margin-bottom: 0
119
- &.is-horizontal
120
- +tablet
121
- display: flex
122
-
123
- .field-label
124
- .label
125
- font-size: inherit
126
- +mobile
127
- margin-bottom: 0.5rem
128
- +tablet
129
- flex-basis: 0
130
- flex-grow: 1
131
- flex-shrink: 0
132
- +ltr-property("margin", 1.5rem)
133
- text-align: right
134
- &.is-small
135
- font-size: $size-small
136
- padding-top: 0.375em
137
- &.is-normal
138
- padding-top: 0.375em
139
- &.is-medium
140
- font-size: $size-medium
141
- padding-top: 0.375em
142
- &.is-large
143
- font-size: $size-large
144
- padding-top: 0.375em
145
-
146
- .field-body
147
- .field .field
148
- margin-bottom: 0
149
- +tablet
150
- display: flex
151
- flex-basis: 0
152
- flex-grow: 5
153
- flex-shrink: 1
154
- .field
155
- margin-bottom: 0
156
- & > .field
157
- flex-shrink: 1
158
- &:not(.is-narrow)
159
- flex-grow: 1
160
- &:not(:last-child)
161
- +ltr-property("margin", 0.75rem)
162
-
163
- .control
164
- box-sizing: border-box
165
- clear: both
166
- font-size: $size-normal
167
- position: relative
168
- text-align: inherit
169
- // Modifiers
170
- &.has-icons-left,
171
- &.has-icons-right
172
- .input,
173
- .select
174
- &:focus
175
- & ~ .icon
176
- color: $input-icon-active-color
177
- &.is-small ~ .icon
178
- font-size: $size-small
179
- &.is-medium ~ .icon
180
- font-size: $size-medium
181
- &.is-large ~ .icon
182
- font-size: $size-large
183
- .icon
184
- color: $input-icon-color
185
- height: $input-height
186
- pointer-events: none
187
- position: absolute
188
- top: 0
189
- width: $input-height
190
- z-index: 4
191
- &.has-icons-left
192
- .input,
193
- .select select
194
- padding-left: $input-height
195
- .icon.is-left
196
- left: 0
197
- &.has-icons-right
198
- .input,
199
- .select select
200
- padding-right: $input-height
201
- .icon.is-right
202
- right: 0
203
- &.is-loading
204
- &::after
205
- @extend %loader
206
- position: absolute !important
207
- +ltr-position(0.625em)
208
- top: 0.625em
209
- z-index: 4
210
- &.is-small:after
211
- font-size: $size-small
212
- &.is-medium:after
213
- font-size: $size-medium
214
- &.is-large:after
215
- font-size: $size-large
@@ -1,5 +0,0 @@
1
- /* Bulma Grid */
2
- @charset "utf-8"
3
-
4
- @import "columns"
5
- @import "tiles"