/
css_consistency.expect.txt
77 lines (64 loc) · 6.62 KB
/
css_consistency.expect.txt
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
<span class="hljs-comment">/* this test is shared with css, less, scss, and stylus to confirm consistent highlighting */</span>
<span class="hljs-selector-tag">div</span> {
-webkit-<span class="hljs-attribute">animation-name</span>: example;
-moz-<span class="hljs-attribute">animation-name</span>: example;
-ms-<span class="hljs-attribute">animation-name</span>: example;
-o-<span class="hljs-attribute">animation-name</span>: example;
<span class="hljs-attribute">animation-name</span>: example;
}
<span class="hljs-keyword">@-webkit-keyframes</span> example {}
<span class="hljs-keyword">@-moz-keyframes</span> example {}
<span class="hljs-keyword">@-ms-keyframes</span> example {}
<span class="hljs-keyword">@-o-keyframes</span> example {}
<span class="hljs-keyword">@keyframes</span> example {}
<span class="hljs-selector-tag">div</span>, <span class="hljs-selector-tag">p</span>, <span class="hljs-selector-tag">table</span> { <span class="hljs-attribute">width</span>: <span class="hljs-number">30px</span>; }
<span class="hljs-selector-tag">div</span> { <span class="hljs-attribute">width</span>:<span class="hljs-number">0</span> <span class="hljs-meta">!important</span>; }
<span class="hljs-selector-tag">h1</span>, <span class="hljs-selector-tag">h2</span>, <span class="hljs-selector-tag">figcaption</span>, <span class="hljs-selector-tag">aside</span>, <span class="hljs-selector-tag">main</span>, <span class="hljs-selector-tag">form</span>, <span class="hljs-selector-tag">footer</span> {}
<span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo">:visited</span> { <span class="hljs-attribute">color</span>: blue; }
<span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">::after</span> { <span class="hljs-attribute">content</span>: <span class="hljs-string">"test"</span>; }
<span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:after</span> { <span class="hljs-attribute">content</span>: <span class="hljs-string">"test"</span>; }
<span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">::before</span> { <span class="hljs-attribute">content</span>: open-quote; }
<span class="hljs-selector-tag">div</span><span class="hljs-selector-pseudo">:before</span> { <span class="hljs-attribute">content</span>: open-quote; }
<span class="hljs-selector-tag">span</span><span class="hljs-selector-pseudo">:nth-child</span>(<span class="hljs-number">33</span>) { <span class="hljs-attribute">color</span>:red; }
<span class="hljs-selector-tag">p</span><span class="hljs-selector-pseudo">:lang</span>(en) {}
<span class="hljs-selector-pseudo">:lang</span>(en) {}
<span class="hljs-selector-tag">a</span><span class="hljs-selector-attr">[href*=<span class="hljs-string">"example"</span>]</span> {}
<span class="hljs-selector-attr">[class^=<span class="hljs-string">"top"</span>]</span> {}
<span class="hljs-keyword">@media</span> (<span class="hljs-keyword">not</span>(<span class="hljs-attribute">hover</span>)) {}
<span class="hljs-keyword">@media</span> <span class="hljs-keyword">not</span> all <span class="hljs-keyword">and</span> (<span class="hljs-attribute">max-width</span>: <span class="hljs-number">600px</span>) {}
<span class="hljs-keyword">@media</span> <span class="hljs-keyword">only</span> screen <span class="hljs-keyword">and</span> (<span class="hljs-attribute">min-width</span>: <span class="hljs-number">900px</span>) <span class="hljs-keyword">and</span> (<span class="hljs-attribute">color-gamut</span>: p3) {}
<span class="hljs-keyword">@media</span>
<span class="hljs-keyword">only</span> screen <span class="hljs-keyword">and</span> (<span class="hljs-attribute">min-width</span>: <span class="hljs-number">100px</span>),
<span class="hljs-keyword">not</span> all <span class="hljs-keyword">and</span> (<span class="hljs-attribute">min-width</span>: <span class="hljs-number">100px</span>),
<span class="hljs-keyword">not</span> print <span class="hljs-keyword">and</span> (<span class="hljs-attribute">min-height</span>: <span class="hljs-number">100px</span>),
(<span class="hljs-attribute">color</span>),
(<span class="hljs-attribute">min-height</span>: <span class="hljs-number">100px</span>) <span class="hljs-keyword">and</span> (<span class="hljs-attribute">max-height</span>: <span class="hljs-number">1000px</span>),
handheld <span class="hljs-keyword">and</span> (<span class="hljs-attribute">orientation</span>: landscape)
{}
<span class="hljs-keyword">@font-face</span> {
<span class="hljs-attribute">font-family</span>: <span class="hljs-string">"Open Sans"</span>;
<span class="hljs-attribute">font-display</span>: swap;
<span class="hljs-attribute">font-stretch</span>: <span class="hljs-number">50%</span> <span class="hljs-number">200%</span>;
<span class="hljs-attribute">font-style</span>: oblique <span class="hljs-number">20deg</span> <span class="hljs-number">50deg</span>;
<span class="hljs-attribute">font-weight</span>: <span class="hljs-number">100</span> <span class="hljs-number">400</span>;
<span class="hljs-attribute">font-variant</span>: no-common-ligatures proportional-nums;
<span class="hljs-attribute">font-feature-settings</span>: <span class="hljs-string">"liga"</span> <span class="hljs-number">0</span>;
<span class="hljs-attribute">font-variation-settings</span>: <span class="hljs-string">"xhgt"</span> <span class="hljs-number">0.7</span>;
<span class="hljs-comment">/* unicode-range: U+0025-00FF, U+4??; */</span>
<span class="hljs-comment">/* it's not 100% clear how url and format should be highlighted universally */</span>
<span class="hljs-comment">/* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"),
url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */</span>
}
<span class="hljs-keyword">@keyframes</span> important1 {
from { <span class="hljs-attribute">margin-top</span>: <span class="hljs-number">50px</span>; }
<span class="hljs-number">50%</span> { <span class="hljs-attribute">margin-top</span>: <span class="hljs-number">60px</span> <span class="hljs-meta">!important</span>; }
to { <span class="hljs-attribute">margin-top</span>: <span class="hljs-number">100px</span>; }
}
<span class="hljs-selector-tag">main</span> {
<span class="hljs-attr">--color</span>: red;
<span class="hljs-attribute">color</span>: var(--color);
}
<span class="hljs-selector-tag">main</span> {
<span class="hljs-comment">/* normal comment */</span>
<span class="hljs-attribute">width</span>: <span class="hljs-comment">/* inline comment */</span> <span class="hljs-number">50px</span>;
}