@medyll/cssfabric 0.2.1-beta.1 → 0.2.1-beta.2

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 (118) hide show
  1. package/dist/css/base/base.css +47 -0
  2. package/dist/css/base/base.min.css +1 -0
  3. package/dist/{styles → css}/box/box.css +1494 -1494
  4. package/dist/{styles → css}/box/box.responsive.css +7034 -7034
  5. package/dist/{styles → css}/color/color.css +1564 -1564
  6. package/dist/{styles → css}/color/color.responsive.css +7779 -7779
  7. package/dist/{styles → css}/cssfabric.css +5145 -5306
  8. package/dist/css/cssfabric.min.css +4877 -0
  9. package/dist/{styles → css}/cssfabric.responsive.css +20400 -20400
  10. package/dist/{styles → css}/flex/flex.css +123 -123
  11. package/dist/{styles → css}/flex/flex.responsive.css +579 -579
  12. package/dist/{styles → css}/grid/grid.css +118 -118
  13. package/dist/{styles → css}/grid/grid.responsive.css +499 -499
  14. package/dist/{styles → css}/menu/menu.css +100 -100
  15. package/dist/{styles → css}/menu/menu.responsive.css +442 -442
  16. package/dist/{styles → css}/overflow/overflow.css +59 -59
  17. package/dist/{styles → css}/overflow/overflow.responsive.css +235 -235
  18. package/dist/{styles → css}/scale/scale.css +718 -718
  19. package/dist/{styles → css}/scale/scale.responsive.css +3249 -3249
  20. package/dist/{styles → css}/table/table.css +71 -71
  21. package/dist/{styles → css}/table/table.responsive.css +369 -369
  22. package/dist/{styles → css}/text/text.css +150 -150
  23. package/dist/{styles → css}/text/text.responsive.css +214 -214
  24. package/dist/{styles → css}/theme/theme.css +245 -245
  25. package/dist/{styles → css}/vars.css +410 -410
  26. package/dist/{styles → css}/zindex/zindex.css +42 -42
  27. package/dist/cssf/cssfLib.d.ts +5 -5
  28. package/dist/cssf/index.d.ts +6 -4
  29. package/dist/cssf/index.js +7 -4
  30. package/dist/{_generated → generated}/cssFabric.vars.json +12 -12
  31. package/dist/{_generated → generated}/cssFabric.vars.md +268 -268
  32. package/dist/index.d.ts +118 -1
  33. package/dist/index.js +119 -2
  34. package/dist/scripts/cssfabric.d.ts +6 -6
  35. package/dist/scripts/cssfabric.js +9 -9
  36. package/dist/scss/_utils.scss +203 -0
  37. package/dist/scss/index.d.ts +3 -0
  38. package/dist/scss/modules/_cssfabric-config.scss +178 -0
  39. package/dist/scss/modules/_mixins.scss +1 -0
  40. package/dist/scss/modules/animation/_animation-vars.scss +17 -0
  41. package/dist/scss/modules/animation/animation.scss +3 -0
  42. package/dist/scss/modules/base/_base-vars.scss +19 -0
  43. package/dist/scss/modules/base/base.scss +58 -0
  44. package/dist/scss/modules/box/_box-build.scss +305 -0
  45. package/dist/scss/modules/box/_box-vars.scss +121 -0
  46. package/dist/scss/modules/box/box-responsive.scss +18 -0
  47. package/dist/scss/modules/box/box.scss +3 -0
  48. package/dist/scss/modules/color/_color-build.scss +196 -0
  49. package/dist/scss/modules/color/_color-vars.scss +80 -0
  50. package/dist/scss/modules/color/color-responsive.scss +23 -0
  51. package/dist/scss/modules/color/color.scss +9 -0
  52. package/dist/scss/modules/css-fabric.scss +1 -0
  53. package/dist/scss/modules/flex/_flex-build.scss +150 -0
  54. package/dist/scss/modules/flex/_flex-vars.scss +84 -0
  55. package/dist/scss/modules/flex/flex-responsive.scss +25 -0
  56. package/dist/scss/modules/flex/flex.scss +3 -0
  57. package/dist/scss/modules/grid/_grid-build.scss +87 -0
  58. package/dist/scss/modules/grid/_grid-vars.scss +88 -0
  59. package/dist/scss/modules/grid/grid-responsive.scss +25 -0
  60. package/dist/scss/modules/grid/grid.scss +6 -0
  61. package/dist/scss/modules/menu/_menu-build.scss +120 -0
  62. package/dist/scss/modules/menu/_menu-vars.scss +29 -0
  63. package/dist/scss/modules/menu/menu-responsive.scss +19 -0
  64. package/dist/scss/modules/menu/menu.scss +6 -0
  65. package/dist/scss/modules/overflow/_overflow-build.scss +22 -0
  66. package/dist/scss/modules/overflow/_overflow-vars.scss +31 -0
  67. package/dist/scss/modules/overflow/overflow-responsive.scss +25 -0
  68. package/dist/scss/modules/overflow/overflow.scss +7 -0
  69. package/dist/scss/modules/scale/_scale-build.scss +142 -0
  70. package/dist/scss/modules/scale/_scale-vars.scss +84 -0
  71. package/dist/scss/modules/scale/scale-responsive.scss +23 -0
  72. package/dist/scss/modules/scale/scale.scss +8 -0
  73. package/dist/scss/modules/table/_table-build.scss +134 -0
  74. package/dist/scss/modules/table/_table-vars.scss +30 -0
  75. package/dist/scss/modules/table/table-responsive.scss +24 -0
  76. package/dist/scss/modules/table/table.scss +8 -0
  77. package/dist/scss/modules/text/_text-build.scss +166 -0
  78. package/dist/scss/modules/text/_text-vars.scss +87 -0
  79. package/dist/scss/modules/text/text-responsive.scss +26 -0
  80. package/dist/scss/modules/text/text.scss +6 -0
  81. package/dist/scss/modules/theme/_theme-build.scss +128 -0
  82. package/dist/scss/modules/theme/_theme-vars.scss +46 -0
  83. package/dist/scss/modules/theme/theme.scss +6 -0
  84. package/dist/scss/modules/vars.scss +46 -0
  85. package/dist/scss/modules/zindex/_zindex-vars.scss +14 -0
  86. package/dist/scss/modules/zindex/zindex.scss +15 -0
  87. package/package.json +6 -4
  88. package/dist/_generated/export.variables.md +0 -240
  89. package/dist/_generated/readme.md +0 -0
  90. package/dist/init/importCssVars.d.ts +0 -1
  91. package/dist/init/importCssVars.js +0 -2
  92. package/dist/styles/base/base.css +0 -208
  93. package/dist/styles/base/base.min.css +0 -1
  94. package/dist/styles/cssfabric.min.css +0 -1
  95. /package/dist/{styles → css}/animation/animation.css +0 -0
  96. /package/dist/{styles → css}/animation/animation.min.css +0 -0
  97. /package/dist/{styles → css}/box/box.min.css +0 -0
  98. /package/dist/{styles → css}/box/box.responsive.min.css +0 -0
  99. /package/dist/{styles → css}/color/color.min.css +0 -0
  100. /package/dist/{styles → css}/color/color.responsive.min.css +0 -0
  101. /package/dist/{styles → css}/cssfabric.responsive.min.css +0 -0
  102. /package/dist/{styles → css}/flex/flex.min.css +0 -0
  103. /package/dist/{styles → css}/flex/flex.responsive.min.css +0 -0
  104. /package/dist/{styles → css}/grid/grid.min.css +0 -0
  105. /package/dist/{styles → css}/grid/grid.responsive.min.css +0 -0
  106. /package/dist/{styles → css}/menu/menu.min.css +0 -0
  107. /package/dist/{styles → css}/menu/menu.responsive.min.css +0 -0
  108. /package/dist/{styles → css}/overflow/overflow.min.css +0 -0
  109. /package/dist/{styles → css}/overflow/overflow.responsive.min.css +0 -0
  110. /package/dist/{styles → css}/scale/scale.min.css +0 -0
  111. /package/dist/{styles → css}/scale/scale.responsive.min.css +0 -0
  112. /package/dist/{styles → css}/table/table.min.css +0 -0
  113. /package/dist/{styles → css}/table/table.responsive.min.css +0 -0
  114. /package/dist/{styles → css}/text/text.min.css +0 -0
  115. /package/dist/{styles → css}/text/text.responsive.min.css +0 -0
  116. /package/dist/{styles → css}/theme/theme.min.css +0 -0
  117. /package/dist/{styles → css}/vars.min.css +0 -0
  118. /package/dist/{styles → css}/zindex/zindex.min.css +0 -0
@@ -1,582 +1,582 @@
1
1
 
2
2
  /**---------------------flex.responsive.css---------------------*/
3
- @media only screen and (min-width: 640px) {
4
- .flex,
5
- .flex-sm-h {
6
- display: flex;
7
- flex-direction: row;
8
- }
9
- .flex > .flex-main,
10
- .flex-sm-h > .flex-main {
11
- flex: 1 1 0;
12
- }
13
- .flex.flex-align-middle,
14
- .flex-sm-h.flex-align-middle {
15
- align-items: center;
16
- }
17
- .flex.flex-align-top,
18
- .flex-sm-h.flex-align-top {
19
- align-items: flex-start;
20
- }
21
- .flex.flex-align-left,
22
- .flex-sm-h.flex-align-left {
23
- align-items: flex-start;
24
- }
25
- .flex.flex-align-right,
26
- .flex-sm-h.flex-align-right {
27
- justify-content: flex-end;
28
- }
29
- .flex.flex-align-bottom,
30
- .flex-sm-h.flex-align-bottom {
31
- align-items: flex-end;
32
- }
33
- .flex.flex-align-center,
34
- .flex-sm-h.flex-align-center {
35
- justify-content: center;
36
- }
37
- .flex.flex-align-middle-center,
38
- .flex-sm-h.flex-align-middle-center {
39
- justify-content: center;
40
- align-content: center;
41
- align-items: center;
42
- }
43
- .flex.flex-align-stretch,
44
- .flex-sm-h.flex-align-stretch {
45
- color: blue;
46
- align-items: stretch;
47
- }
48
- .flex-sm-v {
49
- display: flex;
50
- flex-direction: column;
51
- }
52
- .flex-sm-v > .flex-main {
53
- flex: 1 1 0;
54
- max-height: 100%;
55
- }
56
- .flex-sm-v.flex-align-middle {
57
- justify-content: center;
58
- }
59
- .flex-sm-v.flex-align-top {
60
- justify-content: flex-start;
61
- }
62
- .flex-sm-v.flex-align-left {
63
- align-items: flex-start;
64
- }
65
- .flex-sm-v.flex-align-right {
66
- align-items: flex-end;
67
- }
68
- .flex-sm-v.flex-align-bottom {
69
- justify-content: flex-end;
70
- }
71
- .flex-sm-v.flex-align-center {
72
- align-items: center;
73
- }
74
- .flex-sm-v.flex-align-middle-center {
75
- align-items: center;
76
- justify-content: center;
77
- }
78
- .flex-sm-v.flex-align-stretch {
79
- color: red;
80
- align-items: stretch;
81
- }
82
- .flex-inline {
83
- display: inline-flex;
84
- }
85
- .flex-wrap {
86
- flex-wrap: wrap;
87
- }
88
- .flex-wrap-reverse {
89
- flex-wrap: wrap-reverse;
90
- }
91
- .self-start {
92
- align-self: flex-start;
93
- }
94
- .self-end {
95
- align-self: flex-end;
96
- }
97
- .self-stretch {
98
- align-self: stretch;
99
- }
100
- .flex-grow-0 {
101
- flex-grow: 0;
102
- }
103
- .flex-shrink-0 {
104
- flex-shrink: 0;
105
- }
106
- .flex-grow-1 {
107
- flex-grow: 1;
108
- }
109
- .flex-shrink-1 {
110
- flex-shrink: 1;
111
- }
112
- .flex-grow-2 {
113
- flex-grow: 2;
114
- }
115
- .flex-shrink-2 {
116
- flex-shrink: 2;
117
- }
118
- }
119
- @media only screen and (min-width: 768px) {
120
- .flex,
121
- .flex-md-h {
122
- display: flex;
123
- flex-direction: row;
124
- }
125
- .flex > .flex-main,
126
- .flex-md-h > .flex-main {
127
- flex: 1 1 0;
128
- }
129
- .flex.flex-align-middle,
130
- .flex-md-h.flex-align-middle {
131
- align-items: center;
132
- }
133
- .flex.flex-align-top,
134
- .flex-md-h.flex-align-top {
135
- align-items: flex-start;
136
- }
137
- .flex.flex-align-left,
138
- .flex-md-h.flex-align-left {
139
- align-items: flex-start;
140
- }
141
- .flex.flex-align-right,
142
- .flex-md-h.flex-align-right {
143
- justify-content: flex-end;
144
- }
145
- .flex.flex-align-bottom,
146
- .flex-md-h.flex-align-bottom {
147
- align-items: flex-end;
148
- }
149
- .flex.flex-align-center,
150
- .flex-md-h.flex-align-center {
151
- justify-content: center;
152
- }
153
- .flex.flex-align-middle-center,
154
- .flex-md-h.flex-align-middle-center {
155
- justify-content: center;
156
- align-content: center;
157
- align-items: center;
158
- }
159
- .flex.flex-align-stretch,
160
- .flex-md-h.flex-align-stretch {
161
- color: blue;
162
- align-items: stretch;
163
- }
164
- .flex-md-v {
165
- display: flex;
166
- flex-direction: column;
167
- }
168
- .flex-md-v > .flex-main {
169
- flex: 1 1 0;
170
- max-height: 100%;
171
- }
172
- .flex-md-v.flex-align-middle {
173
- justify-content: center;
174
- }
175
- .flex-md-v.flex-align-top {
176
- justify-content: flex-start;
177
- }
178
- .flex-md-v.flex-align-left {
179
- align-items: flex-start;
180
- }
181
- .flex-md-v.flex-align-right {
182
- align-items: flex-end;
183
- }
184
- .flex-md-v.flex-align-bottom {
185
- justify-content: flex-end;
186
- }
187
- .flex-md-v.flex-align-center {
188
- align-items: center;
189
- }
190
- .flex-md-v.flex-align-middle-center {
191
- align-items: center;
192
- justify-content: center;
193
- }
194
- .flex-md-v.flex-align-stretch {
195
- color: red;
196
- align-items: stretch;
197
- }
198
- .flex-inline {
199
- display: inline-flex;
200
- }
201
- .flex-wrap {
202
- flex-wrap: wrap;
203
- }
204
- .flex-wrap-reverse {
205
- flex-wrap: wrap-reverse;
206
- }
207
- .self-start {
208
- align-self: flex-start;
209
- }
210
- .self-end {
211
- align-self: flex-end;
212
- }
213
- .self-stretch {
214
- align-self: stretch;
215
- }
216
- .flex-grow-0 {
217
- flex-grow: 0;
218
- }
219
- .flex-shrink-0 {
220
- flex-shrink: 0;
221
- }
222
- .flex-grow-1 {
223
- flex-grow: 1;
224
- }
225
- .flex-shrink-1 {
226
- flex-shrink: 1;
227
- }
228
- .flex-grow-2 {
229
- flex-grow: 2;
230
- }
231
- .flex-shrink-2 {
232
- flex-shrink: 2;
233
- }
234
- }
235
- @media only screen and (min-width: 1024px) {
236
- .flex,
237
- .flex-lg-h {
238
- display: flex;
239
- flex-direction: row;
240
- }
241
- .flex > .flex-main,
242
- .flex-lg-h > .flex-main {
243
- flex: 1 1 0;
244
- }
245
- .flex.flex-align-middle,
246
- .flex-lg-h.flex-align-middle {
247
- align-items: center;
248
- }
249
- .flex.flex-align-top,
250
- .flex-lg-h.flex-align-top {
251
- align-items: flex-start;
252
- }
253
- .flex.flex-align-left,
254
- .flex-lg-h.flex-align-left {
255
- align-items: flex-start;
256
- }
257
- .flex.flex-align-right,
258
- .flex-lg-h.flex-align-right {
259
- justify-content: flex-end;
260
- }
261
- .flex.flex-align-bottom,
262
- .flex-lg-h.flex-align-bottom {
263
- align-items: flex-end;
264
- }
265
- .flex.flex-align-center,
266
- .flex-lg-h.flex-align-center {
267
- justify-content: center;
268
- }
269
- .flex.flex-align-middle-center,
270
- .flex-lg-h.flex-align-middle-center {
271
- justify-content: center;
272
- align-content: center;
273
- align-items: center;
274
- }
275
- .flex.flex-align-stretch,
276
- .flex-lg-h.flex-align-stretch {
277
- color: blue;
278
- align-items: stretch;
279
- }
280
- .flex-lg-v {
281
- display: flex;
282
- flex-direction: column;
283
- }
284
- .flex-lg-v > .flex-main {
285
- flex: 1 1 0;
286
- max-height: 100%;
287
- }
288
- .flex-lg-v.flex-align-middle {
289
- justify-content: center;
290
- }
291
- .flex-lg-v.flex-align-top {
292
- justify-content: flex-start;
293
- }
294
- .flex-lg-v.flex-align-left {
295
- align-items: flex-start;
296
- }
297
- .flex-lg-v.flex-align-right {
298
- align-items: flex-end;
299
- }
300
- .flex-lg-v.flex-align-bottom {
301
- justify-content: flex-end;
302
- }
303
- .flex-lg-v.flex-align-center {
304
- align-items: center;
305
- }
306
- .flex-lg-v.flex-align-middle-center {
307
- align-items: center;
308
- justify-content: center;
309
- }
310
- .flex-lg-v.flex-align-stretch {
311
- color: red;
312
- align-items: stretch;
313
- }
314
- .flex-inline {
315
- display: inline-flex;
316
- }
317
- .flex-wrap {
318
- flex-wrap: wrap;
319
- }
320
- .flex-wrap-reverse {
321
- flex-wrap: wrap-reverse;
322
- }
323
- .self-start {
324
- align-self: flex-start;
325
- }
326
- .self-end {
327
- align-self: flex-end;
328
- }
329
- .self-stretch {
330
- align-self: stretch;
331
- }
332
- .flex-grow-0 {
333
- flex-grow: 0;
334
- }
335
- .flex-shrink-0 {
336
- flex-shrink: 0;
337
- }
338
- .flex-grow-1 {
339
- flex-grow: 1;
340
- }
341
- .flex-shrink-1 {
342
- flex-shrink: 1;
343
- }
344
- .flex-grow-2 {
345
- flex-grow: 2;
346
- }
347
- .flex-shrink-2 {
348
- flex-shrink: 2;
349
- }
350
- }
351
- @media only screen and (min-width: 1280px) {
352
- .flex,
353
- .flex-xl-h {
354
- display: flex;
355
- flex-direction: row;
356
- }
357
- .flex > .flex-main,
358
- .flex-xl-h > .flex-main {
359
- flex: 1 1 0;
360
- }
361
- .flex.flex-align-middle,
362
- .flex-xl-h.flex-align-middle {
363
- align-items: center;
364
- }
365
- .flex.flex-align-top,
366
- .flex-xl-h.flex-align-top {
367
- align-items: flex-start;
368
- }
369
- .flex.flex-align-left,
370
- .flex-xl-h.flex-align-left {
371
- align-items: flex-start;
372
- }
373
- .flex.flex-align-right,
374
- .flex-xl-h.flex-align-right {
375
- justify-content: flex-end;
376
- }
377
- .flex.flex-align-bottom,
378
- .flex-xl-h.flex-align-bottom {
379
- align-items: flex-end;
380
- }
381
- .flex.flex-align-center,
382
- .flex-xl-h.flex-align-center {
383
- justify-content: center;
384
- }
385
- .flex.flex-align-middle-center,
386
- .flex-xl-h.flex-align-middle-center {
387
- justify-content: center;
388
- align-content: center;
389
- align-items: center;
390
- }
391
- .flex.flex-align-stretch,
392
- .flex-xl-h.flex-align-stretch {
393
- color: blue;
394
- align-items: stretch;
395
- }
396
- .flex-xl-v {
397
- display: flex;
398
- flex-direction: column;
399
- }
400
- .flex-xl-v > .flex-main {
401
- flex: 1 1 0;
402
- max-height: 100%;
403
- }
404
- .flex-xl-v.flex-align-middle {
405
- justify-content: center;
406
- }
407
- .flex-xl-v.flex-align-top {
408
- justify-content: flex-start;
409
- }
410
- .flex-xl-v.flex-align-left {
411
- align-items: flex-start;
412
- }
413
- .flex-xl-v.flex-align-right {
414
- align-items: flex-end;
415
- }
416
- .flex-xl-v.flex-align-bottom {
417
- justify-content: flex-end;
418
- }
419
- .flex-xl-v.flex-align-center {
420
- align-items: center;
421
- }
422
- .flex-xl-v.flex-align-middle-center {
423
- align-items: center;
424
- justify-content: center;
425
- }
426
- .flex-xl-v.flex-align-stretch {
427
- color: red;
428
- align-items: stretch;
429
- }
430
- .flex-inline {
431
- display: inline-flex;
432
- }
433
- .flex-wrap {
434
- flex-wrap: wrap;
435
- }
436
- .flex-wrap-reverse {
437
- flex-wrap: wrap-reverse;
438
- }
439
- .self-start {
440
- align-self: flex-start;
441
- }
442
- .self-end {
443
- align-self: flex-end;
444
- }
445
- .self-stretch {
446
- align-self: stretch;
447
- }
448
- .flex-grow-0 {
449
- flex-grow: 0;
450
- }
451
- .flex-shrink-0 {
452
- flex-shrink: 0;
453
- }
454
- .flex-grow-1 {
455
- flex-grow: 1;
456
- }
457
- .flex-shrink-1 {
458
- flex-shrink: 1;
459
- }
460
- .flex-grow-2 {
461
- flex-grow: 2;
462
- }
463
- .flex-shrink-2 {
464
- flex-shrink: 2;
465
- }
466
- }
467
- @media only screen and (min-width: 1540px) {
468
- .flex,
469
- .flex-xxl-h {
470
- display: flex;
471
- flex-direction: row;
472
- }
473
- .flex > .flex-main,
474
- .flex-xxl-h > .flex-main {
475
- flex: 1 1 0;
476
- }
477
- .flex.flex-align-middle,
478
- .flex-xxl-h.flex-align-middle {
479
- align-items: center;
480
- }
481
- .flex.flex-align-top,
482
- .flex-xxl-h.flex-align-top {
483
- align-items: flex-start;
484
- }
485
- .flex.flex-align-left,
486
- .flex-xxl-h.flex-align-left {
487
- align-items: flex-start;
488
- }
489
- .flex.flex-align-right,
490
- .flex-xxl-h.flex-align-right {
491
- justify-content: flex-end;
492
- }
493
- .flex.flex-align-bottom,
494
- .flex-xxl-h.flex-align-bottom {
495
- align-items: flex-end;
496
- }
497
- .flex.flex-align-center,
498
- .flex-xxl-h.flex-align-center {
499
- justify-content: center;
500
- }
501
- .flex.flex-align-middle-center,
502
- .flex-xxl-h.flex-align-middle-center {
503
- justify-content: center;
504
- align-content: center;
505
- align-items: center;
506
- }
507
- .flex.flex-align-stretch,
508
- .flex-xxl-h.flex-align-stretch {
509
- color: blue;
510
- align-items: stretch;
511
- }
512
- .flex-xxl-v {
513
- display: flex;
514
- flex-direction: column;
515
- }
516
- .flex-xxl-v > .flex-main {
517
- flex: 1 1 0;
518
- max-height: 100%;
519
- }
520
- .flex-xxl-v.flex-align-middle {
521
- justify-content: center;
522
- }
523
- .flex-xxl-v.flex-align-top {
524
- justify-content: flex-start;
525
- }
526
- .flex-xxl-v.flex-align-left {
527
- align-items: flex-start;
528
- }
529
- .flex-xxl-v.flex-align-right {
530
- align-items: flex-end;
531
- }
532
- .flex-xxl-v.flex-align-bottom {
533
- justify-content: flex-end;
534
- }
535
- .flex-xxl-v.flex-align-center {
536
- align-items: center;
537
- }
538
- .flex-xxl-v.flex-align-middle-center {
539
- align-items: center;
540
- justify-content: center;
541
- }
542
- .flex-xxl-v.flex-align-stretch {
543
- color: red;
544
- align-items: stretch;
545
- }
546
- .flex-inline {
547
- display: inline-flex;
548
- }
549
- .flex-wrap {
550
- flex-wrap: wrap;
551
- }
552
- .flex-wrap-reverse {
553
- flex-wrap: wrap-reverse;
554
- }
555
- .self-start {
556
- align-self: flex-start;
557
- }
558
- .self-end {
559
- align-self: flex-end;
560
- }
561
- .self-stretch {
562
- align-self: stretch;
563
- }
564
- .flex-grow-0 {
565
- flex-grow: 0;
566
- }
567
- .flex-shrink-0 {
568
- flex-shrink: 0;
569
- }
570
- .flex-grow-1 {
571
- flex-grow: 1;
572
- }
573
- .flex-shrink-1 {
574
- flex-shrink: 1;
575
- }
576
- .flex-grow-2 {
577
- flex-grow: 2;
578
- }
579
- .flex-shrink-2 {
580
- flex-shrink: 2;
581
- }
3
+ @media only screen and (min-width: 640px) {
4
+ .flex,
5
+ .flex-sm-h {
6
+ display: flex;
7
+ flex-direction: row;
8
+ }
9
+ .flex > .flex-main,
10
+ .flex-sm-h > .flex-main {
11
+ flex: 1 1 0;
12
+ }
13
+ .flex.flex-align-middle,
14
+ .flex-sm-h.flex-align-middle {
15
+ align-items: center;
16
+ }
17
+ .flex.flex-align-top,
18
+ .flex-sm-h.flex-align-top {
19
+ align-items: flex-start;
20
+ }
21
+ .flex.flex-align-left,
22
+ .flex-sm-h.flex-align-left {
23
+ align-items: flex-start;
24
+ }
25
+ .flex.flex-align-right,
26
+ .flex-sm-h.flex-align-right {
27
+ justify-content: flex-end;
28
+ }
29
+ .flex.flex-align-bottom,
30
+ .flex-sm-h.flex-align-bottom {
31
+ align-items: flex-end;
32
+ }
33
+ .flex.flex-align-center,
34
+ .flex-sm-h.flex-align-center {
35
+ justify-content: center;
36
+ }
37
+ .flex.flex-align-middle-center,
38
+ .flex-sm-h.flex-align-middle-center {
39
+ justify-content: center;
40
+ align-content: center;
41
+ align-items: center;
42
+ }
43
+ .flex.flex-align-stretch,
44
+ .flex-sm-h.flex-align-stretch {
45
+ color: blue;
46
+ align-items: stretch;
47
+ }
48
+ .flex-sm-v {
49
+ display: flex;
50
+ flex-direction: column;
51
+ }
52
+ .flex-sm-v > .flex-main {
53
+ flex: 1 1 0;
54
+ max-height: 100%;
55
+ }
56
+ .flex-sm-v.flex-align-middle {
57
+ justify-content: center;
58
+ }
59
+ .flex-sm-v.flex-align-top {
60
+ justify-content: flex-start;
61
+ }
62
+ .flex-sm-v.flex-align-left {
63
+ align-items: flex-start;
64
+ }
65
+ .flex-sm-v.flex-align-right {
66
+ align-items: flex-end;
67
+ }
68
+ .flex-sm-v.flex-align-bottom {
69
+ justify-content: flex-end;
70
+ }
71
+ .flex-sm-v.flex-align-center {
72
+ align-items: center;
73
+ }
74
+ .flex-sm-v.flex-align-middle-center {
75
+ align-items: center;
76
+ justify-content: center;
77
+ }
78
+ .flex-sm-v.flex-align-stretch {
79
+ color: red;
80
+ align-items: stretch;
81
+ }
82
+ .flex-inline {
83
+ display: inline-flex;
84
+ }
85
+ .flex-wrap {
86
+ flex-wrap: wrap;
87
+ }
88
+ .flex-wrap-reverse {
89
+ flex-wrap: wrap-reverse;
90
+ }
91
+ .self-start {
92
+ align-self: flex-start;
93
+ }
94
+ .self-end {
95
+ align-self: flex-end;
96
+ }
97
+ .self-stretch {
98
+ align-self: stretch;
99
+ }
100
+ .flex-grow-0 {
101
+ flex-grow: 0;
102
+ }
103
+ .flex-shrink-0 {
104
+ flex-shrink: 0;
105
+ }
106
+ .flex-grow-1 {
107
+ flex-grow: 1;
108
+ }
109
+ .flex-shrink-1 {
110
+ flex-shrink: 1;
111
+ }
112
+ .flex-grow-2 {
113
+ flex-grow: 2;
114
+ }
115
+ .flex-shrink-2 {
116
+ flex-shrink: 2;
117
+ }
118
+ }
119
+ @media only screen and (min-width: 768px) {
120
+ .flex,
121
+ .flex-md-h {
122
+ display: flex;
123
+ flex-direction: row;
124
+ }
125
+ .flex > .flex-main,
126
+ .flex-md-h > .flex-main {
127
+ flex: 1 1 0;
128
+ }
129
+ .flex.flex-align-middle,
130
+ .flex-md-h.flex-align-middle {
131
+ align-items: center;
132
+ }
133
+ .flex.flex-align-top,
134
+ .flex-md-h.flex-align-top {
135
+ align-items: flex-start;
136
+ }
137
+ .flex.flex-align-left,
138
+ .flex-md-h.flex-align-left {
139
+ align-items: flex-start;
140
+ }
141
+ .flex.flex-align-right,
142
+ .flex-md-h.flex-align-right {
143
+ justify-content: flex-end;
144
+ }
145
+ .flex.flex-align-bottom,
146
+ .flex-md-h.flex-align-bottom {
147
+ align-items: flex-end;
148
+ }
149
+ .flex.flex-align-center,
150
+ .flex-md-h.flex-align-center {
151
+ justify-content: center;
152
+ }
153
+ .flex.flex-align-middle-center,
154
+ .flex-md-h.flex-align-middle-center {
155
+ justify-content: center;
156
+ align-content: center;
157
+ align-items: center;
158
+ }
159
+ .flex.flex-align-stretch,
160
+ .flex-md-h.flex-align-stretch {
161
+ color: blue;
162
+ align-items: stretch;
163
+ }
164
+ .flex-md-v {
165
+ display: flex;
166
+ flex-direction: column;
167
+ }
168
+ .flex-md-v > .flex-main {
169
+ flex: 1 1 0;
170
+ max-height: 100%;
171
+ }
172
+ .flex-md-v.flex-align-middle {
173
+ justify-content: center;
174
+ }
175
+ .flex-md-v.flex-align-top {
176
+ justify-content: flex-start;
177
+ }
178
+ .flex-md-v.flex-align-left {
179
+ align-items: flex-start;
180
+ }
181
+ .flex-md-v.flex-align-right {
182
+ align-items: flex-end;
183
+ }
184
+ .flex-md-v.flex-align-bottom {
185
+ justify-content: flex-end;
186
+ }
187
+ .flex-md-v.flex-align-center {
188
+ align-items: center;
189
+ }
190
+ .flex-md-v.flex-align-middle-center {
191
+ align-items: center;
192
+ justify-content: center;
193
+ }
194
+ .flex-md-v.flex-align-stretch {
195
+ color: red;
196
+ align-items: stretch;
197
+ }
198
+ .flex-inline {
199
+ display: inline-flex;
200
+ }
201
+ .flex-wrap {
202
+ flex-wrap: wrap;
203
+ }
204
+ .flex-wrap-reverse {
205
+ flex-wrap: wrap-reverse;
206
+ }
207
+ .self-start {
208
+ align-self: flex-start;
209
+ }
210
+ .self-end {
211
+ align-self: flex-end;
212
+ }
213
+ .self-stretch {
214
+ align-self: stretch;
215
+ }
216
+ .flex-grow-0 {
217
+ flex-grow: 0;
218
+ }
219
+ .flex-shrink-0 {
220
+ flex-shrink: 0;
221
+ }
222
+ .flex-grow-1 {
223
+ flex-grow: 1;
224
+ }
225
+ .flex-shrink-1 {
226
+ flex-shrink: 1;
227
+ }
228
+ .flex-grow-2 {
229
+ flex-grow: 2;
230
+ }
231
+ .flex-shrink-2 {
232
+ flex-shrink: 2;
233
+ }
234
+ }
235
+ @media only screen and (min-width: 1024px) {
236
+ .flex,
237
+ .flex-lg-h {
238
+ display: flex;
239
+ flex-direction: row;
240
+ }
241
+ .flex > .flex-main,
242
+ .flex-lg-h > .flex-main {
243
+ flex: 1 1 0;
244
+ }
245
+ .flex.flex-align-middle,
246
+ .flex-lg-h.flex-align-middle {
247
+ align-items: center;
248
+ }
249
+ .flex.flex-align-top,
250
+ .flex-lg-h.flex-align-top {
251
+ align-items: flex-start;
252
+ }
253
+ .flex.flex-align-left,
254
+ .flex-lg-h.flex-align-left {
255
+ align-items: flex-start;
256
+ }
257
+ .flex.flex-align-right,
258
+ .flex-lg-h.flex-align-right {
259
+ justify-content: flex-end;
260
+ }
261
+ .flex.flex-align-bottom,
262
+ .flex-lg-h.flex-align-bottom {
263
+ align-items: flex-end;
264
+ }
265
+ .flex.flex-align-center,
266
+ .flex-lg-h.flex-align-center {
267
+ justify-content: center;
268
+ }
269
+ .flex.flex-align-middle-center,
270
+ .flex-lg-h.flex-align-middle-center {
271
+ justify-content: center;
272
+ align-content: center;
273
+ align-items: center;
274
+ }
275
+ .flex.flex-align-stretch,
276
+ .flex-lg-h.flex-align-stretch {
277
+ color: blue;
278
+ align-items: stretch;
279
+ }
280
+ .flex-lg-v {
281
+ display: flex;
282
+ flex-direction: column;
283
+ }
284
+ .flex-lg-v > .flex-main {
285
+ flex: 1 1 0;
286
+ max-height: 100%;
287
+ }
288
+ .flex-lg-v.flex-align-middle {
289
+ justify-content: center;
290
+ }
291
+ .flex-lg-v.flex-align-top {
292
+ justify-content: flex-start;
293
+ }
294
+ .flex-lg-v.flex-align-left {
295
+ align-items: flex-start;
296
+ }
297
+ .flex-lg-v.flex-align-right {
298
+ align-items: flex-end;
299
+ }
300
+ .flex-lg-v.flex-align-bottom {
301
+ justify-content: flex-end;
302
+ }
303
+ .flex-lg-v.flex-align-center {
304
+ align-items: center;
305
+ }
306
+ .flex-lg-v.flex-align-middle-center {
307
+ align-items: center;
308
+ justify-content: center;
309
+ }
310
+ .flex-lg-v.flex-align-stretch {
311
+ color: red;
312
+ align-items: stretch;
313
+ }
314
+ .flex-inline {
315
+ display: inline-flex;
316
+ }
317
+ .flex-wrap {
318
+ flex-wrap: wrap;
319
+ }
320
+ .flex-wrap-reverse {
321
+ flex-wrap: wrap-reverse;
322
+ }
323
+ .self-start {
324
+ align-self: flex-start;
325
+ }
326
+ .self-end {
327
+ align-self: flex-end;
328
+ }
329
+ .self-stretch {
330
+ align-self: stretch;
331
+ }
332
+ .flex-grow-0 {
333
+ flex-grow: 0;
334
+ }
335
+ .flex-shrink-0 {
336
+ flex-shrink: 0;
337
+ }
338
+ .flex-grow-1 {
339
+ flex-grow: 1;
340
+ }
341
+ .flex-shrink-1 {
342
+ flex-shrink: 1;
343
+ }
344
+ .flex-grow-2 {
345
+ flex-grow: 2;
346
+ }
347
+ .flex-shrink-2 {
348
+ flex-shrink: 2;
349
+ }
350
+ }
351
+ @media only screen and (min-width: 1280px) {
352
+ .flex,
353
+ .flex-xl-h {
354
+ display: flex;
355
+ flex-direction: row;
356
+ }
357
+ .flex > .flex-main,
358
+ .flex-xl-h > .flex-main {
359
+ flex: 1 1 0;
360
+ }
361
+ .flex.flex-align-middle,
362
+ .flex-xl-h.flex-align-middle {
363
+ align-items: center;
364
+ }
365
+ .flex.flex-align-top,
366
+ .flex-xl-h.flex-align-top {
367
+ align-items: flex-start;
368
+ }
369
+ .flex.flex-align-left,
370
+ .flex-xl-h.flex-align-left {
371
+ align-items: flex-start;
372
+ }
373
+ .flex.flex-align-right,
374
+ .flex-xl-h.flex-align-right {
375
+ justify-content: flex-end;
376
+ }
377
+ .flex.flex-align-bottom,
378
+ .flex-xl-h.flex-align-bottom {
379
+ align-items: flex-end;
380
+ }
381
+ .flex.flex-align-center,
382
+ .flex-xl-h.flex-align-center {
383
+ justify-content: center;
384
+ }
385
+ .flex.flex-align-middle-center,
386
+ .flex-xl-h.flex-align-middle-center {
387
+ justify-content: center;
388
+ align-content: center;
389
+ align-items: center;
390
+ }
391
+ .flex.flex-align-stretch,
392
+ .flex-xl-h.flex-align-stretch {
393
+ color: blue;
394
+ align-items: stretch;
395
+ }
396
+ .flex-xl-v {
397
+ display: flex;
398
+ flex-direction: column;
399
+ }
400
+ .flex-xl-v > .flex-main {
401
+ flex: 1 1 0;
402
+ max-height: 100%;
403
+ }
404
+ .flex-xl-v.flex-align-middle {
405
+ justify-content: center;
406
+ }
407
+ .flex-xl-v.flex-align-top {
408
+ justify-content: flex-start;
409
+ }
410
+ .flex-xl-v.flex-align-left {
411
+ align-items: flex-start;
412
+ }
413
+ .flex-xl-v.flex-align-right {
414
+ align-items: flex-end;
415
+ }
416
+ .flex-xl-v.flex-align-bottom {
417
+ justify-content: flex-end;
418
+ }
419
+ .flex-xl-v.flex-align-center {
420
+ align-items: center;
421
+ }
422
+ .flex-xl-v.flex-align-middle-center {
423
+ align-items: center;
424
+ justify-content: center;
425
+ }
426
+ .flex-xl-v.flex-align-stretch {
427
+ color: red;
428
+ align-items: stretch;
429
+ }
430
+ .flex-inline {
431
+ display: inline-flex;
432
+ }
433
+ .flex-wrap {
434
+ flex-wrap: wrap;
435
+ }
436
+ .flex-wrap-reverse {
437
+ flex-wrap: wrap-reverse;
438
+ }
439
+ .self-start {
440
+ align-self: flex-start;
441
+ }
442
+ .self-end {
443
+ align-self: flex-end;
444
+ }
445
+ .self-stretch {
446
+ align-self: stretch;
447
+ }
448
+ .flex-grow-0 {
449
+ flex-grow: 0;
450
+ }
451
+ .flex-shrink-0 {
452
+ flex-shrink: 0;
453
+ }
454
+ .flex-grow-1 {
455
+ flex-grow: 1;
456
+ }
457
+ .flex-shrink-1 {
458
+ flex-shrink: 1;
459
+ }
460
+ .flex-grow-2 {
461
+ flex-grow: 2;
462
+ }
463
+ .flex-shrink-2 {
464
+ flex-shrink: 2;
465
+ }
466
+ }
467
+ @media only screen and (min-width: 1540px) {
468
+ .flex,
469
+ .flex-xxl-h {
470
+ display: flex;
471
+ flex-direction: row;
472
+ }
473
+ .flex > .flex-main,
474
+ .flex-xxl-h > .flex-main {
475
+ flex: 1 1 0;
476
+ }
477
+ .flex.flex-align-middle,
478
+ .flex-xxl-h.flex-align-middle {
479
+ align-items: center;
480
+ }
481
+ .flex.flex-align-top,
482
+ .flex-xxl-h.flex-align-top {
483
+ align-items: flex-start;
484
+ }
485
+ .flex.flex-align-left,
486
+ .flex-xxl-h.flex-align-left {
487
+ align-items: flex-start;
488
+ }
489
+ .flex.flex-align-right,
490
+ .flex-xxl-h.flex-align-right {
491
+ justify-content: flex-end;
492
+ }
493
+ .flex.flex-align-bottom,
494
+ .flex-xxl-h.flex-align-bottom {
495
+ align-items: flex-end;
496
+ }
497
+ .flex.flex-align-center,
498
+ .flex-xxl-h.flex-align-center {
499
+ justify-content: center;
500
+ }
501
+ .flex.flex-align-middle-center,
502
+ .flex-xxl-h.flex-align-middle-center {
503
+ justify-content: center;
504
+ align-content: center;
505
+ align-items: center;
506
+ }
507
+ .flex.flex-align-stretch,
508
+ .flex-xxl-h.flex-align-stretch {
509
+ color: blue;
510
+ align-items: stretch;
511
+ }
512
+ .flex-xxl-v {
513
+ display: flex;
514
+ flex-direction: column;
515
+ }
516
+ .flex-xxl-v > .flex-main {
517
+ flex: 1 1 0;
518
+ max-height: 100%;
519
+ }
520
+ .flex-xxl-v.flex-align-middle {
521
+ justify-content: center;
522
+ }
523
+ .flex-xxl-v.flex-align-top {
524
+ justify-content: flex-start;
525
+ }
526
+ .flex-xxl-v.flex-align-left {
527
+ align-items: flex-start;
528
+ }
529
+ .flex-xxl-v.flex-align-right {
530
+ align-items: flex-end;
531
+ }
532
+ .flex-xxl-v.flex-align-bottom {
533
+ justify-content: flex-end;
534
+ }
535
+ .flex-xxl-v.flex-align-center {
536
+ align-items: center;
537
+ }
538
+ .flex-xxl-v.flex-align-middle-center {
539
+ align-items: center;
540
+ justify-content: center;
541
+ }
542
+ .flex-xxl-v.flex-align-stretch {
543
+ color: red;
544
+ align-items: stretch;
545
+ }
546
+ .flex-inline {
547
+ display: inline-flex;
548
+ }
549
+ .flex-wrap {
550
+ flex-wrap: wrap;
551
+ }
552
+ .flex-wrap-reverse {
553
+ flex-wrap: wrap-reverse;
554
+ }
555
+ .self-start {
556
+ align-self: flex-start;
557
+ }
558
+ .self-end {
559
+ align-self: flex-end;
560
+ }
561
+ .self-stretch {
562
+ align-self: stretch;
563
+ }
564
+ .flex-grow-0 {
565
+ flex-grow: 0;
566
+ }
567
+ .flex-shrink-0 {
568
+ flex-shrink: 0;
569
+ }
570
+ .flex-grow-1 {
571
+ flex-grow: 1;
572
+ }
573
+ .flex-shrink-1 {
574
+ flex-shrink: 1;
575
+ }
576
+ .flex-grow-2 {
577
+ flex-grow: 2;
578
+ }
579
+ .flex-shrink-2 {
580
+ flex-shrink: 2;
581
+ }
582
582
  }