Changeset View
Changeset View
Standalone View
Standalone View
autotests/html/review128925-1.css.html
Show All 17 Lines | |||||
18 | <span style="color:#898887;"> * Block comment</span> | 18 | <span style="color:#898887;"> * Block comment</span> | ||
19 | <span style="color:#898887;"> *</span> | 19 | <span style="color:#898887;"> *</span> | ||
20 | <span style="color:#898887;"> * Alert keywords:</span> | 20 | <span style="color:#898887;"> * Alert keywords:</span> | ||
21 | <span style="color:#898887;"> * </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">TODO</span><span style="color:#898887;"> </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">BUG</span><span style="color:#898887;"> </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">FIXME</span> | 21 | <span style="color:#898887;"> * </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">TODO</span><span style="color:#898887;"> </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">BUG</span><span style="color:#898887;"> </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">FIXME</span> | ||
22 | <span style="color:#898887;"> */</span> | 22 | <span style="color:#898887;"> */</span> | ||
23 | 23 | | |||
24 | <span style="color:#ff5500;">@charset</span> <span style="color:#bf0303;">"UTF-8"</span>; | 24 | <span style="color:#ff5500;">@charset</span> <span style="color:#bf0303;">"UTF-8"</span>; | ||
25 | 25 | | |||
26 | <span style="color:#ff5500;">@import</span> url(<span style="color:#bf0303;">"components/button.css"</span>); | 26 | <span style="color:#ff5500;">@import</span> <span style="color:#644a9b;">url(</span><span style="color:#bf0303;">"components/button.css"</span><span style="color:#644a9b;">)</span>; | ||
27 | 27 | | |||
28 | 28 | | |||
29 | <span style="color:#898887;">/* Properties */</span> | 29 | <span style="color:#898887;">/* Properties */</span> | ||
30 | 30 | | |||
31 | html, body { | 31 | html, body { | ||
32 | <span style="font-weight:bold;">font-family</span>: <span style="color:#bf0303;">"Droid Sans"</span>, Arial, <span style="color:#b08000;">sans-serif</span>; | 32 | <span style="font-weight:bold;">font-family</span>: <span style="color:#bf0303;">"Droid Sans"</span>, Arial, <span style="color:#b08000;">sans-serif</span>; | ||
33 | <span style="font-weight:bold;">font-size</span>: <span style="color:#b08000;">11pt</span>; | 33 | <span style="font-weight:bold;">font-size</span>: <span style="color:#b08000;">11</span><span style="color:#0057ae;">pt</span>; | ||
34 | <span style="font-weight:bold;">line-height</span>: <span style="color:#b08000;">1.5em</span>; | 34 | <span style="font-weight:bold;">line-height</span>: <span style="color:#b08000;">1.5</span><span style="color:#0057ae;">em</span>; | ||
35 | <span style="font-weight:bold;">max-width</span>: calc(<span style="color:#b08000;">100%</span> - <span style="color:#b08000;">300px</span>); | 35 | <span style="font-weight:bold;">max-width</span>: <span style="color:#644a9b;">calc(</span><span style="color:#b08000;">100</span><span style="color:#0057ae;">%</span> - <span style="color:#b08000;">300</span><span style="color:#0057ae;">px</span><span style="color:#644a9b;">)</span>; | ||
36 | <span style="font-weight:bold;">background</span>: <span style="color:#b08000;">#fff000</span>; | 36 | <span style="font-weight:bold;">background</span>: <span style="color:#aa5500;">#fff000</span>; | ||
37 | <span style="font-weight:bold;">text-shadow</span>: <span style="color:#b08000;">0</span> <span style="color:#b08000;">0</span> <span style="color:#b08000;">2px</span> <span style="color:#644a9b;">rgba</span>(<span style="color:#b08000;">0</span>, <span style="color:#b08000;">0</span>, <span style="color:#b08000;">0</span>, <span style="color:#b08000;">0.3</span>); | 37 | <span style="font-weight:bold;">text-shadow</span>: <span style="color:#b08000;">0</span> <span style="color:#b08000;">0</span> <span style="color:#b08000;">2</span><span style="color:#0057ae;">px</span> <span style="color:#644a9b;">rgba(</span><span style="color:#b08000;">0</span>, <span style="color:#b08000;">0</span>, <span style="color:#b08000;">0</span>, <span style="color:#b08000;">0.3</span><span style="color:#644a9b;">)</span>; | ||
38 | <span style="font-weight:bold;">box-sizing</span>: <span style="color:#b08000;">border-box</span>; | 38 | <span style="font-weight:bold;">box-sizing</span>: <span style="color:#b08000;">border-box</span>; | ||
39 | } | 39 | } | ||
40 | 40 | | |||
41 | 41 | | |||
42 | <span style="color:#898887;">/* Selectors */</span> | 42 | <span style="color:#898887;">/* Selectors */</span> | ||
43 | 43 | | |||
44 | blockquote { | 44 | blockquote { | ||
45 | <span style="font-weight:bold;">margin</span>: <span style="color:#b08000;">0</span>; | 45 | <span style="font-weight:bold;">margin</span>: <span style="color:#b08000;">0</span>; | ||
46 | } | 46 | } | ||
47 | 47 | | |||
48 | header <span style="color:#006e28;font-weight:bold;">#logo</span> { | 48 | header <span style="color:#006e28;font-weight:bold;">#logo</span> { | ||
49 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">100px</span>; | 49 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">100</span><span style="color:#0057ae;">px</span>; | ||
50 | } | 50 | } | ||
51 | 51 | | |||
52 | div<span style="color:#006e28;font-weight:bold;">#footer</span> <span style="color:#644a9b;">.link</span> { | 52 | div<span style="color:#006e28;font-weight:bold;">#footer</span> <span style="color:#644a9b;">.link</span> { | ||
53 | <span style="font-weight:bold;">color</span>: <span style="color:#b08000;">blue</span>; | 53 | <span style="font-weight:bold;">color</span>: <span style="color:#aa5500;">blue</span>; | ||
54 | } | 54 | } | ||
55 | 55 | | |||
56 | sidebar <span style="color:#006e28;font-weight:bold;">#subscribe</span> <span style="color:#644a9b;">.subscribe_form</span> input<span style="color:#0095ff;font-weight:bold;">[type=</span><span style="color:#bf0303;">"text"</span><span style="color:#0095ff;font-weight:bold;">]</span> { | 56 | sidebar <span style="color:#006e28;font-weight:bold;">#subscribe</span> <span style="color:#644a9b;">.subscribe_form</span> input<span style="color:#0095ff;font-weight:bold;">[type</span>=<span style="color:#bf0303;">"text"</span><span style="color:#0095ff;font-weight:bold;">]</span> { | ||
57 | <span style="font-weight:bold;">font-size</span>: <span style="color:#b08000;">20px</span>; | 57 | <span style="font-weight:bold;">font-size</span>: <span style="color:#b08000;">20</span><span style="color:#0057ae;">px</span>; | ||
58 | } | 58 | } | ||
59 | 59 | | |||
60 | sidebar <span style="color:#006e28;font-weight:bold;">#subscribe</span> <span style="color:#644a9b;">.subscribe_form</span><span style="color:#b08000;font-style:italic;">:nth-child</span>(2n + 1)<span style="color:#b08000;font-style:italic;">:hover</span> input<span style="color:#0095ff;font-weight:bold;">[class*=</span><span style="color:#bf0303;">"small-"</span><span style="color:#0095ff;font-weight:bold;">]</span> { | 60 | sidebar <span style="color:#006e28;font-weight:bold;">#subscribe</span> <span style="color:#644a9b;">.subscribe_form</span><span style="color:#b08000;font-style:italic;">:nth-child(2n + 1):hover</span> input<span style="color:#0095ff;font-weight:bold;">[class</span>*=<span style="color:#bf0303;">"small-"</span><span style="color:#0095ff;font-weight:bold;">]</span> { | ||
61 | <span style="font-weight:bold;">font-weight</span>: <span style="color:#b08000;">bold</span>; | 61 | <span style="font-weight:bold;">font-weight</span>: <span style="color:#b08000;">bold</span>; | ||
62 | } | 62 | } | ||
63 | 63 | | |||
64 | 64 | | |||
65 | <span style="color:#898887;">/* Media Queries */</span> | 65 | <span style="color:#898887;">/* Media Queries */</span> | ||
66 | 66 | | |||
67 | <span style="color:#ff5500;">@media</span> <span style="color:#b08000;">print</span> { | 67 | <span style="color:#ff5500;">@media</span> <span style="color:#b08000;">print</span> { | ||
68 | <span style="color:#644a9b;">.container</span> { | 68 | <span style="color:#644a9b;">.container</span> { | ||
69 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">100%</span>; | 69 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">100</span><span style="color:#0057ae;">%</span>; | ||
70 | } | 70 | } | ||
71 | } | 71 | } | ||
72 | 72 | | |||
73 | <span style="color:#ff5500;">@media</span> <span style="color:#b08000;">screen</span> and (<span style="font-weight:bold;">min-width</span>: <span style="color:#b08000;">768px</span>) { | 73 | <span style="color:#ff5500;">@media</span> <span style="color:#b08000;">screen</span> <span style="font-weight:bold;">and</span> (<span style="font-weight:bold;">min-width</span>: <span style="color:#b08000;">768</span><span style="color:#0057ae;">px</span>) { | ||
74 | <span style="color:#644a9b;">.container</span> { | 74 | <span style="color:#644a9b;">.container</span> { | ||
75 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">600px</span>; | 75 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">600</span><span style="color:#0057ae;">px</span>; | ||
76 | } | 76 | } | ||
77 | } | 77 | } | ||
78 | 78 | | |||
79 | <span style="color:#ff5500;">@media</span> <span style="color:#b08000;">screen</span> and (<span style="font-weight:bold;">min-width</span>: <span style="color:#b08000;">768px</span>) and (<span style="font-weight:bold;">max-width</span>: <span style="color:#b08000;">960px</span>) { | 79 | <span style="color:#ff5500;">@media</span> <span style="color:#b08000;">screen</span> <span style="font-weight:bold;">and</span> (<span style="font-weight:bold;">min-width</span>: <span style="color:#b08000;">768</span><span style="color:#0057ae;">px</span>) <span style="font-weight:bold;">and</span> (<span style="font-weight:bold;">max-width</span>: <span style="color:#b08000;">960</span><span style="color:#0057ae;">px</span>) { | ||
80 | <span style="color:#644a9b;">.container</span> { | 80 | <span style="color:#644a9b;">.container</span> { | ||
81 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">720px</span>; | 81 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">720</span><span style="color:#0057ae;">px</span>; | ||
82 | } | 82 | } | ||
83 | } | 83 | } | ||
84 | 84 | | |||
85 | 85 | | |||
86 | <span style="color:#898887;">/* Fontface */</span> | 86 | <span style="color:#898887;">/* Fontface */</span> | ||
87 | 87 | | |||
88 | <span style="color:#ff5500;">@font-face</span> { | 88 | <span style="color:#ff5500;">@font-face</span> { | ||
89 | <span style="font-weight:bold;">font-family</span>: MyHelvetica; | 89 | <span style="font-weight:bold;">font-family</span>: MyHelvetica; | ||
90 | <span style="font-weight:bold;">src</span>: <span style="color:#644a9b;">local</span>(<span style="color:#bf0303;">"Helvetica Neue Bold"</span>), | 90 | <span style="font-weight:bold;">src</span>: <span style="color:#644a9b;">local(</span><span style="color:#bf0303;">"Helvetica Neue Bold"</span><span style="color:#644a9b;">)</span>, | ||
91 | <span style="color:#644a9b;">local</span>(<span style="color:#bf0303;">"HelveticaNeue-Bold"</span>), | 91 | <span style="color:#644a9b;">local(</span><span style="color:#bf0303;">"HelveticaNeue-Bold"</span><span style="color:#644a9b;">)</span>, | ||
92 | <span style="color:#644a9b;">url</span>(MgOpenModernaBold<span style="color:#b08000;">.</span>ttf); | 92 | <span style="color:#644a9b;">url(</span><span style="color:#bf0303;">MgOpenModernaBold.ttf</span><span style="color:#644a9b;">)</span>; | ||
93 | <span style="font-weight:bold;">font-weight</span>: <span style="color:#b08000;">bold</span>; | 93 | <span style="font-weight:bold;">font-weight</span>: <span style="color:#b08000;">bold</span>; | ||
94 | } | 94 | } | ||
95 | 95 | | |||
96 | <span style="color:#898887;">/* Animation (Keyframes) */</span> | 96 | <span style="color:#898887;">/* Animation (Keyframes) */</span> | ||
97 | 97 | | |||
98 | <span style="color:#ff5500;">@keyframes</span> slidein { | 98 | <span style="color:#ff5500;">@keyframes</span> slidein { | ||
99 | from { | 99 | <span style="color:#b08000;">from</span> { | ||
100 | <span style="font-weight:bold;">margin-left</span>: <span style="color:#b08000;">100%</span>; | 100 | <span style="font-weight:bold;">margin-left</span>: <span style="color:#b08000;">100</span><span style="color:#0057ae;">%</span>; | ||
101 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">300%</span>; | 101 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">300</span><span style="color:#0057ae;">%</span>; | ||
102 | } | 102 | } | ||
103 | 103 | | |||
104 | to { | 104 | <span style="color:#b08000;">to</span> { | ||
105 | <span style="font-weight:bold;">margin-left</span>: <span style="color:#b08000;">0%</span>; | 105 | <span style="font-weight:bold;">margin-left</span>: <span style="color:#b08000;">0</span><span style="color:#0057ae;">%</span>; | ||
106 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">100%</span>; | 106 | <span style="font-weight:bold;">width</span>: <span style="color:#b08000;">100</span><span style="color:#0057ae;">%</span>; | ||
107 | } | 107 | } | ||
108 | } | 108 | } | ||
109 | 109 | | |||
110 | 110 | | |||
111 | <span style="color:#898887;">/* Region markers */</span> | 111 | <span style="color:#898887;">/* Region markers */</span> | ||
112 | 112 | | |||
113 | <span style="color:#0057ae;background-color:#e0e9f8;">/*BEGIN Comment */</span> | 113 | <span style="color:#0057ae;background-color:#e0e9f8;">/*BEGIN Comment */</span> | ||
114 | 114 | | |||
115 | 115 | | |||
116 | 116 | | |||
117 | <span style="color:#0057ae;background-color:#e0e9f8;">/*END Comment */</span> | 117 | <span style="color:#0057ae;background-color:#e0e9f8;">/*END Comment */</span> | ||
118 | 118 | | |||
119 | </pre></body></html> | 119 | </pre></body></html> |