|
1 /* |
|
2 * Shared stuff that all Enano themes (should) use |
|
3 */ |
|
4 |
|
5 /* Information, warning, question, error, and wait boxes */ |
|
6 div.error-box { background-image: url(../../../images/error.png); background-repeat: no-repeat; background-color: #FFF4F4; border: 1px dashed #406080; padding: 10px 10px 10px 50px; margin: 1em 0 0 0; min-height: 25px; } |
|
7 div.info-box { background-image: url(../../../images/info.png); background-repeat: no-repeat; background-color: #F4F4FF; border: 1px dashed #406080; padding: 10px 10px 10px 50px; margin: 1em 0 0 0; min-height: 25px; } |
|
8 div.warning-box { background-image: url(../../../images/warning.png); background-repeat: no-repeat; background-color: #FFFFF4; border: 1px dashed #406080; padding: 10px 10px 10px 50px; margin: 1em 0 0 0; min-height: 25px; } |
|
9 div.question-box { background-image: url(../../../images/question.png); background-repeat: no-repeat; background-color: #F4FFF4; border: 1px dashed #406080; padding: 10px 10px 10px 50px; margin: 1em 0 0 0; min-height: 25px; } |
|
10 div.wait-box { background-image: url(../../../images/wait.png); background-repeat: no-repeat; background-color: #FFF4FF; border: 1px dashed #406080; padding: 10px 10px 10px 50px; margin: 1em 0 0 0; min-height: 25px; } |
|
11 |
|
12 /* toolbar */ |
|
13 div.toolbar { |
|
14 border-bottom: 1px solid #909090; |
|
15 background-color: #D0D0D0; |
|
16 padding: 2px 0; |
|
17 height: 22px; |
|
18 font-family: arial, sans-serif; |
|
19 font-size: 8pt; |
|
20 } |
|
21 div.toolbar ul { |
|
22 margin: 0; |
|
23 padding: 0; |
|
24 } |
|
25 div.toolbar ul li { |
|
26 list-style: none; |
|
27 margin: 0; |
|
28 float: left; |
|
29 } |
|
30 div.toolbar a img { |
|
31 opacity: 0.6; |
|
32 /*filter: alpha(opacity=60);*/ |
|
33 } |
|
34 div.toolbar a:hover img { |
|
35 opacity: 1; |
|
36 /*filter: alpha(opacity=100);*/ |
|
37 } |
|
38 div.toolbar a { |
|
39 display: block; |
|
40 padding: 2px; |
|
41 border: 1px solid transparent; |
|
42 cursor: default; |
|
43 width: auto; |
|
44 color: #000000; |
|
45 margin: 0 2px; |
|
46 max-height: 16px; |
|
47 text-decoration: none; |
|
48 } |
|
49 div.toolbar a:hover { |
|
50 border: 1px solid #202090; |
|
51 background-color: #ceceed; |
|
52 color: #000000; |
|
53 text-decoration: none; |
|
54 } |
|
55 div.toolbar a:active { |
|
56 border: 1px solid #A0A0A0; |
|
57 background-color: #E0E0E0; |
|
58 } |
|
59 div.toolbar img { |
|
60 margin: 0; |
|
61 padding: 0; |
|
62 display: inline; |
|
63 border-width: 0px; |
|
64 } |
|
65 div.toolbar a span { |
|
66 position: relative; |
|
67 top: -4px; |
|
68 } |
|
69 div.toolbar li span { |
|
70 padding-left: 2px; |
|
71 padding-right: 5px; |
|
72 } |
|
73 |
|
74 /* vertical toolbar */ |
|
75 div.toolbar_vert { |
|
76 border: 1px solid #909090; |
|
77 background-color: #D0D0D0; |
|
78 padding: 2px 0; |
|
79 } |
|
80 div.toolbar_vert ul { |
|
81 margin: 0; |
|
82 padding: 0; |
|
83 } |
|
84 div.toolbar_vert ul li { |
|
85 list-style: none; |
|
86 margin: 0; |
|
87 } |
|
88 div.toolbar_vert a img { |
|
89 opacity: 0.6; |
|
90 /*filter: alpha(opacity=60);*/ |
|
91 } |
|
92 div.toolbar_vert a:hover img { |
|
93 opacity: 1; |
|
94 /*filter: alpha(opacity=100);*/ |
|
95 } |
|
96 div.toolbar_vert a { |
|
97 display: block; |
|
98 padding: 2px; |
|
99 border: 1px solid transparent; |
|
100 cursor: default; |
|
101 width: auto; |
|
102 color: #000000; |
|
103 margin: 0 2px; |
|
104 max-height: 16px; |
|
105 text-decoration: none; |
|
106 } |
|
107 div.toolbar_vert a:hover { |
|
108 border: 1px solid #202090; |
|
109 background-color: #ceceed; |
|
110 color: #000000; |
|
111 text-decoration: none; |
|
112 } |
|
113 div.toolbar_vert a:active { |
|
114 border: 1px solid #A0A0A0; |
|
115 background-color: #E0E0E0; |
|
116 } |
|
117 div.toolbar_vert img { |
|
118 margin: 0; |
|
119 padding: 0; |
|
120 display: inline; |
|
121 border-width: 0px; |
|
122 } |
|
123 div.toolbar_vert a span { |
|
124 position: relative; |
|
125 top: -4px; |
|
126 } |
|
127 div.toolbar_vert li span { |
|
128 padding-left: 2px; |
|
129 padding-right: 5px; |
|
130 } |
|
131 |
|
132 /* Tables */ |
|
133 .tblholder { margin: 10px 0 0 0; padding: 0; border: 1px solid #AAAAAA; background-color: #E8E8E8; } |
|
134 |
|
135 /* The beautiful tables inside what may not obviously be mdg-comment divs */ |
|
136 div.tblholder td.row1 { padding: 4px; background-color: #E0E0E0; } |
|
137 div.tblholder td.row2 { padding: 4px; background-color: #F0F0F0; } |
|
138 div.tblholder td.row3 { padding: 4px; background-color: #E8E8E8; } |
|
139 div.tblholder th { padding: 4px; background-color: #7080A0; font-weight: bold; text-align: center; color: #FFFFFF; } |
|
140 div.tblholder th.subhead { padding: 4px; background-color: #90A0B0; font-weight: bold; text-align: center; color: #FFFFFF; } |
|
141 div.tblholder table { background-color: #FFFFFF; width: 100%; } |
|
142 |
|
143 /* Well, not Midget and not comments (usually), but that's what the class is called ;-). Basically an informational window or used as a wrapper for tables. */ |
|
144 .mdg-comment, .mdg-infobox { margin-left: 1em; padding: 7px; border: 1px solid #AAAAAA; background-color: #E8E8E8; } |
|
145 |
|
146 /* JWS window theming */ |
|
147 div.jswindow { border: 2px solid #7090B0; border-top: 5px solid #7090B0; padding: 0px; font-family: Trebuchet MS, tahoma, verdana, arial, sans-serif; font-size: 9pt; display: none; position: absolute; background-color: #FFFFFF; } |
|
148 div.titlebar { background-color: #7090B0; color: #FFFFFF; font-family: Trebuchet MS, tahoma, verdana, arial, sans-serif; font-size: 9pt; padding-bottom: 4px; cursor: default; } |
|
149 div.titlebar div.closebtn { width: 16px; height: 16px; border: 1px solid #B0D0F0; background-color: #90B0D0; display: block; } |
|
150 div.titlebar div.closebtn:hover { width: 16px; height: 16px; border: 1px solid #FFFFFF; background-color: #B0D0F0; display: block; } |
|
151 div.titlebar table, div.titlebar td { margin: 0; padding: 0; } |
|
152 div.jswindow div.content { padding: 10px; margin: 0; background-color: #FFFFFF; } |
|
153 |
|
154 /* Search results */ |
|
155 div.search-result h3 { font-size: 14pt; margin: 10px 0 0 0; } |
|
156 div.search-result h3 a { color: blue !important; font-weight: normal; padding-bottom: 0; } |
|
157 div.search-result p { margin: 10px 0 0 0 !important; font-family: arial, helvetica, sans-serif; font-size: 10pt; } |
|
158 div.search-result span.search-result-info { color: green; } |
|
159 div.search-result span.search-term, div.search-result span.title-search-term { background-color: #FFFFC0; font-weight: bold; } |
|
160 |
|
161 /* |
|
162 * Search box |
|
163 */ |
|
164 |
|
165 input.js-search-box { |
|
166 font-size: 13px; |
|
167 margin: 0; |
|
168 padding: 1px !important; |
|
169 background-image: url(../../../images/search-box-normal.gif); |
|
170 height: 15px; |
|
171 background-repeat: repeat-x; |
|
172 border-width: 1px; |
|
173 border-style: solid; |
|
174 border-color: #6c6c6c; |
|
175 color: #C0C0C0; |
|
176 } |
|
177 |
|
178 input.js-search-box:focus { |
|
179 background-image: url(../../../images/search-box-hilite.gif); |
|
180 color: #666; |
|
181 } |
|
182 |
|
183 div.js-search-submit { |
|
184 display: block; |
|
185 position: absolute; |
|
186 width: 24px; |
|
187 height: 19px; |
|
188 font-size: 1px; |
|
189 line-height: 19px; |
|
190 clip: rect(0px, 24px, 19px, 0px); |
|
191 overflow: hidden; |
|
192 margin: 0; |
|
193 padding: 0; |
|
194 background: transparent url(../../../images/search-btn-normal.png) no-repeat !important; |
|
195 background-repeat: no-repeat; |
|
196 cursor: pointer; |
|
197 } |
|
198 |
|
199 div.js-search-submit:hover { |
|
200 background-image: url(../../../images/search-btn-hilite.png); |
|
201 } |
|
202 |
|
203 input[type ^="text"].username, input[type ^="password"].password { |
|
204 padding: 2px 2px 2px 27px; |
|
205 width: 96px; |
|
206 height: 15px; |
|
207 border: 0px none #000; |
|
208 font-size: 11px; |
|
209 } |
|
210 input[type ^="text"].username { |
|
211 background-image: url(../../../images/login-username.png); |
|
212 } |
|
213 input[type ^="password"].password { |
|
214 background-image: url(../../../images/login-password.png); |
|
215 } |
|
216 |
|
217 /* |
|
218 * jBox menu system |
|
219 */ |
|
220 |
|
221 div.menu, div.menu_nojs { |
|
222 background-color: #D0D0D0; |
|
223 border: 1px solid #A0A0A0; |
|
224 font-size: 9pt; |
|
225 } |
|
226 div.menu a, div.menu div.label { |
|
227 padding: 2pt 5px; |
|
228 text-decoration: none; |
|
229 display: block; |
|
230 float: left; |
|
231 color: #404040; |
|
232 } |
|
233 div.menu_nojs a, div.menu_nojs div.label { |
|
234 padding: 2pt 5px; |
|
235 text-decoration: none; |
|
236 display: block; |
|
237 color: #404040; |
|
238 } |
|
239 div.menu div.label, div.menu_nojs div.label { |
|
240 color: #101010; |
|
241 } |
|
242 div.menu span.sep, div.menu_nojs span.sep { |
|
243 display: block; |
|
244 float: left; |
|
245 width: 5px; |
|
246 } |
|
247 div.menu div.multopts, div.menu_nojs div.multopts { |
|
248 line-height: 17pt; |
|
249 } |
|
250 div.menu div.multopts a, div.menu div.multopts div.label, div.menu_nojs div.multopts a, div.menu_nojs div.multopts div.label { |
|
251 float: none; |
|
252 display: inline; |
|
253 } |
|
254 div.menu a:hover, div.menu_nojs a:hover { |
|
255 color: #FFFFFF; |
|
256 background-color: #808080; |
|
257 } |
|
258 div.menu input[type ^="text"], div.menu input[type ^="password"], div.menu_nojs input[type ^="text"], div.menu_nojs input[type ^="password"] { |
|
259 border-width: 0; |
|
260 font-size: 9pt; |
|
261 padding: 4px 5px; |
|
262 max-width: 70px; |
|
263 background-color: #E0E0E0; |
|
264 } |
|
265 div.menu input[type ^="text"]:hover, div.menu input[type ^="password"]:hover, div.menu_nojs input[type ^="text"]:hover, div.menu_nojs input[type ^="password"]:hover { |
|
266 background-color: #E8E8E8; |
|
267 } |
|
268 div.menu input[type ^="text"]:focus, div.menu input[type ^="password"]:focus, div.menu_nojs input[type ^="text"]:focus, div.menu_nojs input[type ^="password"]:focus { |
|
269 background-color: #F0F0F0; |
|
270 } |
|
271 div.menu input[type ^="button"], div.menu input[type ^="submit"], div.menu_nojs input[type ^="button"], div.menu_nojs input[type ^="submit"] { |
|
272 border-width: 0; |
|
273 font-size: 9pt; |
|
274 padding: 3px 5px; |
|
275 max-width: 70px; |
|
276 } |
|
277 div.menu a.current, div.menu a.current:hover, div.menu_nojs a.current, div.menu_nojs a.current:hover { |
|
278 color: #FFFFFF; |
|
279 background-color: #505050; |
|
280 } |
|
281 div.menu ul { |
|
282 display: none; |
|
283 position: absolute; |
|
284 padding: 0; |
|
285 margin: 0; |
|
286 background-color: #D0D0D0; |
|
287 border: 1px solid #A0A0A0; |
|
288 min-width: 120px; |
|
289 } |
|
290 div.menu_nojs ul { |
|
291 display: block; |
|
292 clear: both; |
|
293 } |
|
294 div.menu ul li, div.menu_nojs ul li { |
|
295 list-style: none; |
|
296 } |
|
297 div.menu ul a, div.menu_nojs ul a { |
|
298 float: none; |
|
299 margin: 0; |
|
300 } |
|
301 span.menuclear { |
|
302 font-size: 1px; |
|
303 height: 0px; |
|
304 width: 0px; |
|
305 clear: left; |
|
306 line-height: 0px; |
|
307 display: block; |
|
308 } |
|
309 |
|
310 /* |
|
311 * Docking Boxes code (for the sidebar editor) |
|
312 */ |
|
313 |
|
314 /* group container(s) */ |
|
315 #sbedit { |
|
316 margin: 0; |
|
317 padding: 0; |
|
318 /* position:relative; /* additional outer containers must also have position:relative */ |
|
319 } |
|
320 /* keyboard navigation tooltip */ |
|
321 .dbx-tooltip { |
|
322 display:block; |
|
323 position:absolute; |
|
324 margin:36px 0 0 125px; |
|
325 width:185px; |
|
326 border:1px solid #000; |
|
327 background:#ffd; |
|
328 color:#000; |
|
329 font:normal normal normal 0.85em tahoma, arial, sans-serif; |
|
330 padding:2px 4px 3px 5px; |
|
331 text-align:left; |
|
332 } |
|
333 * html .dbx-tooltip { width:195px; } |
|
334 |
|
335 /* use CSS2 system colors in CSS2 browsers |
|
336 but not safari, which doesn't support them */ |
|
337 *[class="dbx-tooltip"]:lang(en) { |
|
338 border-color:InfoText; |
|
339 background:InfoBackground; |
|
340 color:InfoText; |
|
341 font:small-caption; |
|
342 font-weight:normal; |
|
343 } |
|
344 /* additional clone styles */ |
|
345 .dbx-clone { |
|
346 opacity: 0.8; |
|
347 } |
|
348 .dbx-content ul { |
|
349 margin: 0; padding: 0; |
|
350 list-style: none; |
|
351 } |
|
352 .dbx-content li a, .dbx-content li a:hover { |
|
353 text-decoration: none; color: #666; |
|
354 } |
|
355 .dbx-content2 { |
|
356 margin: 0px 1px 0px 1px; |
|
357 } |
|
358 |
|
359 /* Progress bars */ |
|
360 div.progressbar { |
|
361 padding: 2px; |
|
362 background-color: #90A0B0; |
|
363 width: 308px; |
|
364 } |
|
365 div.progressbar_inner { |
|
366 min-width: 30px; |
|
367 color: white; |
|
368 background-color: #7080A0; |
|
369 padding: 4px; |
|
370 } |
|
371 /* User notification - courtest of wikipedia.org (not sure if this is included with MediaWiki) */ |
|
372 /* user notification thing */ |
|
373 |
|
374 .usermessage { |
|
375 background-color: #ffce7b; |
|
376 border: 1px solid #ffa500; |
|
377 color: black; |
|
378 margin: 10px 0 1em; |
|
379 padding: .5em 1em; |
|
380 vertical-align: middle; |
|
381 } |
|
382 .usermessage a:link, .usermessage a:active, .usermessage a:visited { |
|
383 color: #CA7520; |
|
384 } |
|
385 .usermessage a:hover { |
|
386 color: #AA5500 !important; |
|
387 } |
|
388 div.thumbnail { |
|
389 display: table; |
|
390 border: 1px solid #AAAAAA; |
|
391 background-color: #F0F0F0; |
|
392 padding: 4px; |
|
393 margin-bottom: 10px; |
|
394 } |
|
395 div.thumbnail-inner { |
|
396 background-image: url(../../../images/thumbnail.png); |
|
397 background-position: top right; |
|
398 background-repeat: no-repeat; |
|
399 } |
|
400 |