lets wrap the form
[Braintube.git] / style.css
1 /* ikiwiki style sheet */
2
3 /* Note that instead of modifying this style sheet, you can instead edit
4  * local.css and use it to override or change settings in this one.
5  */
6
7 /* html5 compat */
8 article,
9 header,
10 footer,
11 nav {
12         display: block;
13 }
14
15 .header {
16         margin: 0;
17         font-size: 22px;
18         font-weight: bold;
19         line-height: 1em;
20         display: block;
21 }
22
23 .inlineheader .author {
24         margin: 0;
25         font-size: 18px;
26         font-weight: bold;
27         display: block;
28 }
29
30 .actions ul {
31         margin: 0;
32         padding: 6px .4em;
33         height: 1em;
34         list-style-type: none;
35 }
36 .actions li {
37         display: inline;
38         padding: .2em;
39 }
40 .pageheader .actions ul {
41         border-bottom: 1px solid #000;
42 }
43
44 .inlinepage .actions ul {
45         border-bottom: 0;
46 }
47
48 #otherlanguages ul {
49         margin: 0;
50         padding: 6px;
51         list-style-type: none;
52 }
53 #otherlanguages li {
54         display: inline;
55         padding: .2em .4em;
56 }
57 .pageheader #otherlanguages {
58         border-bottom: 1px solid #000;
59 }
60
61 .inlinecontent {
62         margin-top: .4em;
63 }
64
65 .pagefooter,
66 .inlinefooter,
67 .comments {
68         clear: both;
69         padding-bottom: 10px;
70 }
71
72 #pageinfo {
73         margin: 1em 0;
74         border-top: 1px solid #000;
75 }
76
77 .tags {
78         margin-top: 1em;
79 }
80
81 .inlinepage .tags {
82         display: inline;
83 }
84
85 .mapparent {
86         text-decoration: none;
87 }
88
89 .img caption {
90         font-size: 80%;
91         caption-side: bottom;
92         text-align: center;
93 }
94
95 img.img {
96         margin: 0.5ex;
97 }
98
99 .align-left {
100         float:left;
101 }
102
103 .align-right {
104         float:right;
105 }
106
107 #backlinks {
108         margin-top: 1em;
109 }
110
111 #searchform {
112         display: inline;
113         float: right;
114 }
115
116 #editcontent {
117         width: 98%;
118 }
119
120 .editcontentdiv {
121         width: auto;
122         overflow: auto;
123 }
124
125 img {
126         border-style: none;
127 }
128
129 pre {
130         overflow: auto;
131 }
132
133 div.recentchanges {
134         border-style: solid;
135         border-width: 1px;
136         overflow: auto;
137         width: auto;
138         clear: none;
139         background: #eee;
140         color: black !important;
141 }
142 .recentchanges .metadata {
143         padding: 0px 0.5em;
144 }
145 .recentchanges .changelog {
146         font-style: italic;
147         clear: both;
148         display: block;
149         padding: 1px 2px;
150         background: white !important;
151         color: black !important;
152 }
153 .recentchanges .desc {
154         display: none;
155 }
156 .recentchanges .diff {
157         display: none;
158 }
159 .recentchanges .committer {
160         float: left;
161         margin: 0;
162         width: 40%;
163 }
164 .recentchanges .committype {
165         float: left;
166         margin: 0;
167         width: 5%;
168         font-size: small;
169 }
170 .recentchanges .changedate {
171         float: left;
172         margin: 0;
173         width: 35%;
174         font-size: small;
175 }
176 .recentchanges .pagelinks {
177         float: right;
178         margin: 0;
179         width: 60%;
180 }
181
182 #blogform {
183         padding: 10px 10px;
184         border: 1px solid #aaa;
185         background: #eee;
186         color: black !important;
187         width: auto;
188         overflow: auto;
189 }
190
191 .inlinepage {
192         padding: 10px 10px;
193         border: 1px solid #aaa;
194         overflow: auto;
195 }
196
197 .pagedate,
198 .pagelicense,
199 .pagecopyright {
200         font-style: italic;
201         display: block;
202         margin-top: 1em;
203 }
204
205 .error {
206         color: #C00;
207 }
208
209 .sidebar {
210         width: 20ex;
211         float: right;
212         margin-left: 4px;
213         margin-bottom: 4px;
214         margin-top: -1px;
215         padding: 0ex 2ex;
216         background: white;
217         border: 1px solid black;
218         color: black !important;
219 }
220
221 hr.poll {
222         height: 10pt;
223         color: white !important;
224         background: #eee;
225         border: 2px solid black;
226 }
227 div.poll {
228         margin-top: 1ex;
229         margin-bottom: 1ex;
230         padding: 1ex 1ex;
231         border: 1px solid #aaa;
232 }
233
234 span.color {
235         padding: 2px;
236 }
237
238 .comment-header,
239 .microblog-header {
240         font-style: italic;
241         margin-top: .3em;
242 }
243 .comment .author,
244 .microblog .author {
245         font-weight: bold;
246 }
247 .comment-subject {
248         font-weight: bold;
249 }
250 .comment {
251         border: 1px solid #aaa;
252         padding: 3px;
253 }
254
255 div.progress {
256         margin-top: 1ex;
257         margin-bottom: 1ex;
258         border: 1px solid #888;
259         width: 400px;
260         background: #eee;
261         color: black !important;
262         padding: 1px;
263 }
264 div.progress-done {
265         background: #ea6 !important;
266         color: black !important;
267         text-align: center;
268         padding: 1px;
269 }
270
271 /* things to hide in printouts */
272 @media print {
273         .actions { display: none; }
274         .tags { display: none; }
275         .feedbutton { display: none; }
276         #searchform { display: none; }
277         #blogform { display: none; }
278         #backlinks { display: none; }
279 }
280
281 /* infobox template */
282 .infobox {
283         float: right;
284         margin-left: 2ex;
285         margin-top: 1ex;
286         margin-bottom: 1ex;
287         padding: 1ex 1ex;
288         border: 1px solid #aaa;
289         background: white;
290         color: black !important;
291 }
292
293 /* notebox template */
294 .notebox {
295         float: right;
296         margin-left: 2ex;
297         margin-top: 1ex;
298         margin-bottom: 1ex;
299         padding: 1ex 1ex;
300         border: 1px solid #aaa;
301         width: 25%;
302         background: white;
303         color: black !important;
304 }
305
306 /* popup template and backlinks hiding */
307 .popup {
308         border-bottom: 1px dotted #366;
309         color: #366;
310 }
311 .popup .balloon,
312 .popup .paren,
313 .popup .expand {
314         display: none;
315 }
316 .popup:hover .balloon,
317 .popup:focus .balloon {
318         position: absolute;
319         display: inline;
320         margin: 1em 0 0 -2em;
321         padding: 0.625em;
322         border: 2px solid;
323         background-color: #dee;
324         color: black;
325 }
326
327 /* form styling */
328 fieldset {
329         margin: 1ex 0;
330         border: 1px solid black;
331 }
332 legend {
333         padding: 0 1ex;
334 }
335 .fb_submit {
336         float: left;
337         margin: 2px 0;
338 }
339 label.block {    
340         display: block;   
341 }
342 label.inline {    
343         display: inline;
344 }
345 input#openid_identifier {
346         background: url(wikiicons/openidlogin-bg.gif) no-repeat;
347         background-color: #fff;
348         background-position: 0 50%;
349         color: #000;
350         padding-left: 18px;
351 }
352 input#searchbox {
353         background: url(wikiicons/search-bg.gif) no-repeat;
354         background-color: #fff;
355         background-position: 100% 50%;
356         color: #000;
357         padding-right: 16px;
358 }
359 /* invalid form fields */
360 .fb_invalid {
361         color: red;
362         background: white !important;
363 }
364 /* required form fields */
365 .fb_required {
366         font-weight: bold;
367 }
368
369 /* highlight plugin */
370 pre.hl { color:#000000; background-color:#ffffff; }
371 .hl.num { color:#2928ff; }
372 .hl.esc { color:#ff00ff; }
373 .hl.str { color:#ff0000; }
374 .hl.dstr { color:#818100; }
375 .hl.slc { color:#838183; font-style:italic; }
376 .hl.com { color:#838183; font-style:italic; }
377 .hl.dir { color:#008200; }
378 .hl.sym { color:#000000; }
379 .hl.line { color:#555555; }
380 .hl.mark { background-color:#ffffbb; }
381 .hl.kwa { color:#000000; font-weight:bold; }
382 .hl.kwb { color:#830000; }
383 .hl.kwc { color:#000000; font-weight:bold; }
384 .hl.kwd { color:#010181; }
385
386 /* calendar plugin */
387 .month-calendar-day-this-day,
388 .year-calendar-this-month {
389         background-color: #eee;
390 }
391 .month-calendar-day-head,
392 .month-calendar-day-nolink,
393 .month-calendar-day-link,
394 .month-calendar-day-this-day,
395 .month-calendar-day-future {
396         text-align: right;
397 }
398 .month-calendar-arrow A:link,
399 .year-calendar-arrow A:link,
400 .month-calendar-arrow A:visited,
401 .year-calendar-arrow A:visited {
402         text-decoration: none;
403         font-weight: normal;
404         font-size: 150%;
405 }
406
407 /* outlines */
408 li.L1 { list-style: upper-roman; }
409 li.L2 { list-style: decimal; }
410 li.L3 { list-style: lower-alpha; }
411 li.L4 { list-style: disc; }
412 li.L5 { list-style: square; }
413 li.L6 { list-style: circle; }
414 li.L7 { list-style: lower-roman; }
415 li.L8 { list-style: upper-alpha; }
416
417 /* tag cloud */
418 .pagecloud {
419         float: right;
420         width: 30%;
421         text-align: center;
422         padding: 10px 10px;
423         border: 1px solid #aaa;
424         background: #eee;
425         color: black !important;
426 }
427 .smallestPC { font-size: 70%; }
428 .smallPC { font-size: 85%; }
429 .normalPC { font-size: 100%; }
430 .bigPC { font-size: 115%; }
431 .biggestPC { font-size: 130%; }
432
433 /* orange feed button */
434 .feedbutton {
435         background: #ff6600;
436         color: white !important;
437         border-left: 1px solid #cc9966;
438         border-top: 1px solid #ccaa99;
439         border-right: 1px solid #993300;
440         border-bottom: 1px solid #331100;
441         padding: 0px 0.5em 0px 0.5em;
442         font-family: sans-serif;
443         font-weight: bold;
444         font-size: small;
445         text-decoration: none;
446         margin-top: 1em;
447 }
448 .feedbutton:hover {
449         color: white !important;
450         background: #ff9900;
451 }
452
453 /* openid selector */
454 #openid_choice {
455         display: none;
456 }
457 #openid_input_area {
458         clear: both;
459         padding: 10px;
460 }
461 #openid_btns, #openid_btns br {
462         clear: both;
463 }
464 #openid_highlight {
465         background-color: black;
466         float: left;
467 }
468 .openid_large_btn {
469         padding: 1em 1.5em;
470         border: 1px solid #DDD;
471         margin: 3px;
472         float: left;
473 }
474 .openid_small_btn {
475         padding: 4px 4px;
476         border: 1px solid #DDD;
477         margin: 3px;
478         float: left;
479 }
480 a.openid_large_btn:focus {
481         outline: none;
482 }
483 a.openid_large_btn:focus {
484         -moz-outline-style: none;
485 }
486 .openid_selected {
487         border: 4px solid #DDD;
488 }