UNPKG

metro4

Version:

The front-end framework for Build responsive, mobile-first projects on the web with the first front-end component library in Metro Style

metroui.org.ua

olton/Metro-UI-CSS

87 lines (75 loc) • 3.75 kB
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
@import (once) "include/vars"; @import (once) "include/mixins"; .visible {visibility: visible !important;} .no-visible {visibility: hidden !important;} .d-none {display: none!important;} .d-block {display: block!important;} .d-inline {display: inline!important;} .d-inline-block {display: inline-block!important;} .d-table {display: table!important;} .d-table-row {display: table-row!important;} .d-table-cell {display: table-cell!important;} .d-flex {display: flex!important;} .d-inline-flex {display: inline-flex!important;} html.metro-touch-device { .d-none-touch {display: none!important;} .d-block-touch {display: block!important;} .d-inline-touch {display: inline!important;} .d-inline-block-touch {display: inline-block!important;} .d-table-touch {display: table!important;} .d-table-row-touch {display: table-row!important;} .d-table-cell-touch {display: table-cell!important;} .d-flex-touch {display: flex!important;} .d-inline-flex-touch {display: inline-flex!important;} } html.metro-no-touch-device { .d-none-no-touch {display: none!important;} .d-block-no-touch {display: block!important;} .d-inline-no-touch {display: inline!important;} .d-inline-block-no-touch {display: inline-block!important;} .d-table-no-touch {display: table!important;} .d-table-row-no-touch {display: table-row!important;} .d-table-cell-no-touch {display: table-cell!important;} .d-flex-no-touch {display: flex!important;} .d-inline-flex-no-touch {display: inline-flex!important;} } .generate-display-media-options(@mediaBreakpointListMobileLength); .generate-display-media-options(@name, @i: 1) when (@i <= @mediaBreakpointListMobileLength) { @m: extract(@mediaBreakpointListMobile, @i); @media screen and (min-width: @@m) { .visible-@{m} {visibility: visible !important;} .no-visible-@{m} {visibility: hidden !important;} .d-none-@{m} {display: none!important;} .d-block-@{m} {display: block!important;} .d-inline-@{m} {display: inline!important;} .d-inline-block-@{m} {display: inline-block!important;} .d-table-@{m} {display: table!important;} .d-table-row-@{m} {display: table-row!important;} .d-table-cell-@{m} {display: table-cell!important;} .d-flex-@{m} {display: flex!important;} .d-inline-flex-@{m} {display: inline-flex!important;} html.metro-touch-device { .d-none-touch-@{m} {display: none!important;} .d-block-touch-@{m} {display: block!important;} .d-inline-touch-@{m} {display: inline!important;} .d-inline-block-touch-@{m} {display: inline-block!important;} .d-table-touch-@{m} {display: table!important;} .d-table-row-touch-@{m} {display: table-row!important;} .d-table-cell-touch-@{m} {display: table-cell!important;} .d-flex-touch-@{m} {display: flex!important;} .d-inline-flex-touch-@{m} {display: inline-flex!important;} } html.metro-no-touch-device { .d-none-no-touch-@{m} {display: none!important;} .d-block-no-touch-@{m} {display: block!important;} .d-inline-no-touch-@{m} {display: inline!important;} .d-inline-block-no-touch-@{m} {display: inline-block!important;} .d-table-no-touch-@{m} {display: table!important;} .d-table-row-no-touch-@{m} {display: table-row!important;} .d-table-cell-no-touch-@{m} {display: table-cell!important;} .d-flex-no-touch-@{m} {display: flex!important;} .d-inline-flex-no-touch-@{m} {display: inline-flex!important;} } } .generate-display-media-options(@name, @i + 1); }