1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
|
{
"by_name": {
"$button-color": {
"name": "$button-color",
"value": "$text-strong",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 21%)"
},
"$button-background-color": {
"name": "$button-background-color",
"value": "$scheme-main",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 100%)"
},
"$button-family": {
"name": "$button-family",
"value": "false",
"type": "boolean"
},
"$button-border-color": {
"name": "$button-border-color",
"value": "$border",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 86%)"
},
"$button-border-width": {
"name": "$button-border-width",
"value": "$control-border-width",
"type": "variable"
},
"$button-padding-vertical": {
"name": "$button-padding-vertical",
"value": "calc(0.5em - #{$button-border-width})",
"type": "size"
},
"$button-padding-horizontal": {
"name": "$button-padding-horizontal",
"value": "1em",
"type": "size"
},
"$button-hover-color": {
"name": "$button-hover-color",
"value": "$link-hover",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 21%)"
},
"$button-hover-border-color": {
"name": "$button-hover-border-color",
"value": "$link-hover-border",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 71%)"
},
"$button-focus-color": {
"name": "$button-focus-color",
"value": "$link-focus",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 21%)"
},
"$button-focus-border-color": {
"name": "$button-focus-border-color",
"value": "$link-focus-border",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(229, 53%, 53%)"
},
"$button-focus-box-shadow-size": {
"name": "$button-focus-box-shadow-size",
"value": "0 0 0 0.125em",
"type": "size"
},
"$button-focus-box-shadow-color": {
"name": "$button-focus-box-shadow-color",
"value": "bulmaRgba($link, 0.25)",
"type": "compound"
},
"$button-active-color": {
"name": "$button-active-color",
"value": "$link-active",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 21%)"
},
"$button-active-border-color": {
"name": "$button-active-border-color",
"value": "$link-active-border",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 29%)"
},
"$button-text-color": {
"name": "$button-text-color",
"value": "$text",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 29%)"
},
"$button-text-decoration": {
"name": "$button-text-decoration",
"value": "underline",
"type": "string"
},
"$button-text-hover-background-color": {
"name": "$button-text-hover-background-color",
"value": "$background",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 96%)"
},
"$button-text-hover-color": {
"name": "$button-text-hover-color",
"value": "$text-strong",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 21%)"
},
"$button-ghost-background": {
"name": "$button-ghost-background",
"value": "none",
"type": "string"
},
"$button-ghost-border-color": {
"name": "$button-ghost-border-color",
"value": "transparent",
"type": "string"
},
"$button-ghost-color": {
"name": "$button-ghost-color",
"value": "$link",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(229, 53%, 53%)"
},
"$button-ghost-decoration": {
"name": "$button-ghost-decoration",
"value": "none",
"type": "string"
},
"$button-ghost-hover-color": {
"name": "$button-ghost-hover-color",
"value": "$link",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(229, 53%, 53%)"
},
"$button-ghost-hover-decoration": {
"name": "$button-ghost-hover-decoration",
"value": "underline",
"type": "string"
},
"$button-disabled-background-color": {
"name": "$button-disabled-background-color",
"value": "$scheme-main",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 100%)"
},
"$button-disabled-border-color": {
"name": "$button-disabled-border-color",
"value": "$border",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 86%)"
},
"$button-disabled-shadow": {
"name": "$button-disabled-shadow",
"value": "none",
"type": "shadow"
},
"$button-disabled-opacity": {
"name": "$button-disabled-opacity",
"value": "0.5",
"type": "unitless"
},
"$button-static-color": {
"name": "$button-static-color",
"value": "$text-light",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 48%)"
},
"$button-static-background-color": {
"name": "$button-static-background-color",
"value": "$scheme-main-ter",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 96%)"
},
"$button-static-border-color": {
"name": "$button-static-border-color",
"value": "$border",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 86%)"
},
"$button-colors": {
"name": "$button-colors",
"value": "$colors",
"type": "variable",
"computed_type": "map",
"computed_value": "Bulma colors"
},
"$button-responsive-sizes": {
"name": "$button-responsive-sizes",
"value": "(\"mobile\": (\"small\": ($size-small * 0.75), \"normal\": ($size-small * 0.875), \"medium\": $size-small, \"large\": $size-normal), \"tablet-only\": (\"small\": ($size-small * 0.875), \"normal\": ($size-small), \"medium\": $size-normal, \"large\": $size-medium))",
"type": "compound"
}
},
"list": [
"$button-color",
"$button-background-color",
"$button-family",
"$button-border-color",
"$button-border-width",
"$button-padding-vertical",
"$button-padding-horizontal",
"$button-hover-color",
"$button-hover-border-color",
"$button-focus-color",
"$button-focus-border-color",
"$button-focus-box-shadow-size",
"$button-focus-box-shadow-color",
"$button-active-color",
"$button-active-border-color",
"$button-text-color",
"$button-text-decoration",
"$button-text-hover-background-color",
"$button-text-hover-color",
"$button-ghost-background",
"$button-ghost-border-color",
"$button-ghost-color",
"$button-ghost-decoration",
"$button-ghost-hover-color",
"$button-ghost-hover-decoration",
"$button-disabled-background-color",
"$button-disabled-border-color",
"$button-disabled-shadow",
"$button-disabled-opacity",
"$button-static-color",
"$button-static-background-color",
"$button-static-border-color",
"$button-colors",
"$button-responsive-sizes"
],
"file_path": "elements/button.sass"
}
|
