|
1 /* This Source Code Form is subject to the terms of the Mozilla Public |
|
2 * License, v. 2.0. If a copy of the MPL was not distributed with this |
|
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ |
|
4 |
|
5 /* ===== xulscrollbars.css ============================================== |
|
6 == Styles used by XUL scrollbar-related elements. |
|
7 ======================================================================= */ |
|
8 |
|
9 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); |
|
10 @namespace html url("http://www.w3.org/1999/xhtml"); /* namespace for HTML elements */ |
|
11 |
|
12 /* ::::: scrollbar ::::: */ |
|
13 |
|
14 scrollbar { |
|
15 -moz-appearance: scrollbartrack-horizontal; |
|
16 -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar"); |
|
17 cursor: default; |
|
18 background: url("chrome://global/skin/scrollbar/slider.gif") scrollbar; |
|
19 pointer-events: auto; |
|
20 } |
|
21 |
|
22 @media all and (-moz-overlay-scrollbars) { |
|
23 scrollbar[root="true"] { |
|
24 position: relative; |
|
25 z-index: 2147483647; /* largest positive value of a signed 32-bit integer */ |
|
26 } |
|
27 |
|
28 scrollbar:not([active="true"]), |
|
29 scrollbar[disabled="true"] { |
|
30 visibility: hidden; |
|
31 } |
|
32 } |
|
33 |
|
34 scrollbar[orient="vertical"] |
|
35 { |
|
36 -moz-appearance: scrollbartrack-vertical; |
|
37 } |
|
38 |
|
39 /* ::::: borders for thumb and buttons ::::: */ |
|
40 |
|
41 thumb, |
|
42 scrollbarbutton { |
|
43 border: 2px solid; |
|
44 -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight; |
|
45 -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow; |
|
46 -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow; |
|
47 -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight; |
|
48 background-color: -moz-Dialog; |
|
49 } |
|
50 |
|
51 /* ::::: thumb (horizontal) ::::: */ |
|
52 |
|
53 thumb { |
|
54 -moz-appearance: scrollbarthumb-vertical; |
|
55 min-height: 8px; |
|
56 } |
|
57 |
|
58 thumb[orient="horizontal"] { |
|
59 -moz-appearance: scrollbarthumb-horizontal; |
|
60 min-width: 8px; |
|
61 } |
|
62 |
|
63 /* ::::: scrollbar button ::::: */ |
|
64 |
|
65 scrollbarbutton { |
|
66 background: -moz-Dialog no-repeat 50% 50%; |
|
67 min-width: 16px; |
|
68 min-height: 16px; |
|
69 } |
|
70 |
|
71 scrollbarbutton:hover:active, scrollbarbutton[active="true"] { |
|
72 -moz-border-top-colors: ThreeDShadow -moz-Dialog; |
|
73 -moz-border-right-colors: ThreeDShadow -moz-Dialog; |
|
74 -moz-border-bottom-colors: ThreeDShadow -moz-Dialog; |
|
75 -moz-border-left-colors: ThreeDShadow -moz-Dialog; |
|
76 background-position: 60% 60%; |
|
77 } |
|
78 |
|
79 /* ::::: square at the corner of two scrollbars ::::: */ |
|
80 |
|
81 scrollcorner { |
|
82 /* XXX -moz-appearance: scrollcorner; */ |
|
83 -moz-binding: url(chrome://global/content/bindings/scrollbar.xml#scrollbar-base); |
|
84 width: 16px; |
|
85 cursor: default; |
|
86 background-color: -moz-Dialog; |
|
87 } |
|
88 |
|
89 /* ..... increment .... */ |
|
90 |
|
91 scrollbarbutton[type="increment"] { |
|
92 -moz-appearance: scrollbarbutton-right; |
|
93 background-image: url("chrome://global/skin/arrow/arrow-rit.gif") |
|
94 } |
|
95 |
|
96 scrollbarbutton[type="increment"][disabled="true"] { |
|
97 background-image: url("chrome://global/skin/arrow/arrow-rit-dis.gif") |
|
98 } |
|
99 |
|
100 scrollbar[orient="vertical"] > scrollbarbutton[type="increment"] { |
|
101 -moz-appearance: scrollbarbutton-down; |
|
102 background-image: url("chrome://global/skin/arrow/arrow-dn.gif") |
|
103 } |
|
104 |
|
105 scrollbar[orient="vertical"] > scrollbarbutton[type="increment"][disabled="true"] { |
|
106 background-image: url("chrome://global/skin/arrow/arrow-dn-dis.gif") |
|
107 } |
|
108 |
|
109 /* ..... decrement .... */ |
|
110 |
|
111 scrollbarbutton[type="decrement"] { |
|
112 -moz-appearance: scrollbarbutton-left; |
|
113 background-image: url("chrome://global/skin/arrow/arrow-lft.gif") |
|
114 } |
|
115 |
|
116 scrollbarbutton[type="decrement"][disabled="true"] { |
|
117 background-image: url("chrome://global/skin/arrow/arrow-lft-dis.gif") |
|
118 } |
|
119 |
|
120 scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"] { |
|
121 -moz-appearance: scrollbarbutton-up; |
|
122 background-image: url("chrome://global/skin/arrow/arrow-up.gif") |
|
123 } |
|
124 |
|
125 scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"][disabled="true"] { |
|
126 background-image: url("chrome://global/skin/arrow/arrow-up-dis.gif") |
|
127 } |
|
128 |
|
129 /* :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */ |
|
130 /* ::::::::::::::::::::: MEDIA PRINT :::::::::::::::::::::: */ |
|
131 /* :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */ |
|
132 @media print { |
|
133 /* ::::: scrollbar ::::: */ |
|
134 |
|
135 html|div scrollbar { |
|
136 -moz-appearance: scrollbartrack-horizontal; |
|
137 -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar"); |
|
138 cursor: default; |
|
139 background: url("chrome://global/skin/scrollbar/slider.gif") scrollbar; |
|
140 } |
|
141 |
|
142 html|div scrollbar[orient="vertical"] |
|
143 { |
|
144 -moz-appearance: scrollbartrack-vertical; |
|
145 } |
|
146 |
|
147 /* ::::: borders for thumb and buttons ::::: */ |
|
148 |
|
149 html|div thumb, |
|
150 html|div scrollbarbutton { |
|
151 border: 2px solid; |
|
152 -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight; |
|
153 -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow; |
|
154 -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow; |
|
155 -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight; |
|
156 background-color: -moz-Dialog; |
|
157 } |
|
158 |
|
159 /* ::::: thumb (horizontal) ::::: */ |
|
160 |
|
161 html|div thumb { |
|
162 -moz-appearance: scrollbarthumb-vertical; |
|
163 min-height: 8px; |
|
164 } |
|
165 |
|
166 html|div thumb[orient="horizontal"] { |
|
167 -moz-appearance: scrollbarthumb-horizontal; |
|
168 min-width: 8px; |
|
169 } |
|
170 |
|
171 /* ::::: scrollbar button ::::: */ |
|
172 |
|
173 html|div scrollbarbutton { |
|
174 background: -moz-Dialog no-repeat 50% 50%; |
|
175 min-width: 16px; |
|
176 min-height: 16px; |
|
177 } |
|
178 |
|
179 html|div scrollbarbutton:hover:active, html|div scrollbarbutton[active="true"] { |
|
180 -moz-border-top-colors: ThreeDShadow -moz-Dialog; |
|
181 -moz-border-right-colors: ThreeDShadow -moz-Dialog; |
|
182 -moz-border-bottom-colors: ThreeDShadow -moz-Dialog; |
|
183 -moz-border-left-colors: ThreeDShadow -moz-Dialog; |
|
184 background-position: 60% 60%; |
|
185 } |
|
186 |
|
187 /* ..... increment .... */ |
|
188 |
|
189 html|div scrollbarbutton[type="increment"] { |
|
190 -moz-appearance: scrollbarbutton-right; |
|
191 background-image: url("chrome://global/skin/arrow/arrow-rit.gif") |
|
192 } |
|
193 |
|
194 html|div scrollbarbutton[type="increment"][disabled="true"] { |
|
195 background-image: url("chrome://global/skin/arrow/arrow-rit-dis.gif") |
|
196 } |
|
197 |
|
198 html|div scrollbar[orient="vertical"] > scrollbarbutton[type="increment"] { |
|
199 -moz-appearance: scrollbarbutton-down; |
|
200 background-image: url("chrome://global/skin/arrow/arrow-dn.gif") |
|
201 } |
|
202 |
|
203 html|div scrollbar[orient="vertical"] > scrollbarbutton[type="increment"][disabled="true"] { |
|
204 background-image: url("chrome://global/skin/arrow/arrow-dn-dis.gif") |
|
205 } |
|
206 |
|
207 /* ..... decrement .... */ |
|
208 |
|
209 html|div scrollbarbutton[type="decrement"] { |
|
210 -moz-appearance: scrollbarbutton-left; |
|
211 background-image: url("chrome://global/skin/arrow/arrow-lft.gif") |
|
212 } |
|
213 |
|
214 html|div scrollbarbutton[type="decrement"][disabled="true"] { |
|
215 background-image: url("chrome://global/skin/arrow/arrow-lft-dis.gif") |
|
216 } |
|
217 |
|
218 html|div scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"] { |
|
219 -moz-appearance: scrollbarbutton-up; |
|
220 background-image: url("chrome://global/skin/arrow/arrow-up.gif") |
|
221 } |
|
222 |
|
223 html|div scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"][disabled="true"] { |
|
224 background-image: url("chrome://global/skin/arrow/arrow-up-dis.gif") |
|
225 } |
|
226 |
|
227 } |