forked from swc-project/swc
/
input.css
110 lines (78 loc) · 3.48 KB
/
input.css
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
@media print {
body { font-size: 10pt; }
}
@media print, print {
body { font-size: 10pt; }
}
@media (min-width: 900px), (min-width: 900px) {
a {
color: red;
}
}
@media only screen and (min-width: 320px), only screen and (min-width: 320px) {
body { line-height: 1.4; }
}
@media (400px <= width <= 700px), (400px <= width <= 700px) {
body { line-height: 1.4; }
}
@media screen and (((min-width: 900px))) {
article {
padding: 1rem 3rem;
}
}
@media (((height > 600px))) {
body { line-height: 1.4; }
}
@media (((400px <= width <= 700px))) {
body { line-height: 1.4; }
}
@media (((foo: bar))) {
body { line-height: 1.4; }
}
@media (((min-width: 30em))) and (((orientation: landscape))) { .test { color: red } }
@media screen and (((min-width: 30em))) and (((orientation: landscape))) { .test { color: red } }
@media screen and (((min-width: 30em) and (max-width: 300px))) and (((orientation: landscape))) { .test { color: red } }
@media (((min-height: 680px))), screen and (((orientation: portrait))) { .test { color: red } }
@media (((not (color)))) or (hover) { .test { color: red } }
@media only screen and ((min-width: 320px) and (max-width: 1480px)) { body {background: red;} }
@media ((min-width: 320px) and (max-width: 1480px)) { body { background: red; } }
@media ((min-width: 320px) or (max-width: 1480px)) { body {background: red;} }
@media ((min-width: 320px) and (max-width: 1480px)) and (orientation: landscape) { body {background: red;} }
@media (min-width: 320px) and ((max-width: 1480px) and (orientation: landscape)) { body {background: red;} }
@media ((min-width: 320px) or (max-width: 1480px)) or (orientation: landscape) { body {background: red;} }
@media (min-width: 320px) or ((max-width: 1480px) or (orientation: landscape)) { body {background: red;} }
@media screen and ((min-width: 320px) and (max-width: 1480px)) and (orientation: landscape) { body {background: red;} }
@media screen and (min-width: 320px) and ((max-width: 1480px) and (orientation: landscape)) { body {background: red;} }
@media not (((resolution: -300dpi))) { body { background: green; } }
@media (grid) and (max-width: 15em) { body { background: green; } }
@media (max-width: calc(5px + 1rem)) { body { color: red; } }
@media (-webkit-calc(10px + 100px) < width <= calc(1000px + 10px)) { body { color: red; } }
@media (color) { body { color: red; } }
@media (min-color: 1) { body { color: red; } }
@media (color >= 1) { body { color: red; } }
@media (1 <= color) { body { color: red; } }
@media (color-index) { body { color: red; } }
@media (min-color-index: 1) { body { color: red; } }
@media (color-index >= 1) { body { color: red; } }
@media (1 <= color-index) { body { color: red; } }
@media (monochrome) { body { color: red; } }
@media (min-monochrome: 1) { body { color: red; } }
@media (monochrome >= 1) { body { color: red; } }
@media (1 <= monochrome) { body { color: red; } }
@media (width = 1024px) { body {background: green;} }
@media (1024px = width) { body {background: green;} }
@media (width: 1024px) { body {background: green;} }
@media (min-width: 900px) and (min-width: 900px) and (min-width: 900px),
(min-width: 900px) or (min-width: 900px) or (min-width: 900px) or (min-width: 900px)
{
a {
color: red;
}
}
@media screen and (min-width: 900px) and (min-width: 900px) and (min-width: 900px),
(min-width: 900px) or (min-width: 900px) or (min-width: 900px) or (min-width: 900px)
{
a {
color: red;
}
}