1/**
2 * This file provides the most basic styles.
3 *
4 * If you integrate DokuWiki into another project, you might either
5 * want to integrate this file into the other project as well, or use
6 * the other project's basic CSS for DokuWiki instead of this one.
7 *
8 * @author Anika Henke <anika@selfthinker.org>
9 */
10
11html {
12    overflow-x: auto;
13    overflow-y: scroll;
14}
15html,
16body {
17    color: @ini_text;
18    background: @ini_background_site url(images/page-gradient.png) top left repeat-x;
19    margin: 0;
20    padding: 0;
21}
22body {
23    font: normal 87.5%/1.4 Arial, sans-serif;
24    /* default font size: 100% => 16px; 93.75% => 15px; 87.5% => 14px; 81.25% => 13px; 75% => 12px */
25    -webkit-text-size-adjust: 100%;
26}
27
28
29/*____________ headers ____________*/
30
31caption,
32figcaption,
33summary,
34legend {
35    padding: 0;
36    margin: 0 0 .35em;
37    line-height: 1.2;
38}
39h1,
40h2,
41h3,
42h4,
43h5,
44h6 {
45    color: #ddd;
46    font-weight: bold;
47    padding: 0;
48    line-height: 1.2;
49    clear: left; /* ideally 'both', but problems with toc */
50}
51[dir=rtl] h1,
52[dir=rtl] h2,
53[dir=rtl] h3,
54[dir=rtl] h4,
55[dir=rtl] h5,
56[dir=rtl] h6 {
57    clear: right;
58}
59
60h1 {
61    font-size: 2em;
62    margin: 0 0 0.444em;
63}
64h2 {
65    font-size: 1.5em;
66    margin: 0 0 0.666em;
67    border-bottom: 1px solid @ini_text_alt;
68}
69h3 {
70    font-size: 1.125em;
71    margin: 0 .6em 0.888em;
72}
73h4 {
74    font-size: 1em;
75    margin: 0 .9em 1.0em;
76}
77h5 {
78    font-size: .875em;
79    margin: 0 1.2em 1.1428em;
80}
81h6 {
82    font-size: .75em;
83    margin: 0 1.4em 1.333em;
84}
85/* bottom margin = 1 / font-size */
86
87
88/*____________ basic margins and paddings ____________*/
89
90p,
91ul,
92ol,
93dl,
94pre,
95table,
96hr,
97blockquote,
98figure,
99details,
100fieldset,
101address {
102    margin: 0 0 1.4em 0; /* bottom margin = line-height */
103    padding: 0;
104}
105
106div,
107video,
108audio {
109    margin: 0;
110    padding: 0;
111}
112
113
114/*____________ lists ____________*/
115
116ul,
117ol {
118    padding: 0 0 0 1.5em;
119}
120[dir=rtl] ul,
121[dir=rtl] ol {
122    padding: 0 1.5em 0 0;
123}
124
125li,
126dd {
127    padding: 0;
128    margin: 0 0 0 1.5em;
129}
130[dir=rtl] li,
131[dir=rtl] dd {
132    margin: 0 1.5em 0 0;
133}
134dt {
135    font-weight: bold;
136    margin: 0;
137    padding: 0;
138}
139
140li ul,
141li ol,
142li dl,
143dl ul,
144dl ol,
145dl dl {
146    margin-bottom: 0;
147    padding: 0;
148}
149li li {
150    font-size: 100%;
151}
152
153ul             { list-style: square outside; }
154ol             { list-style: decimal outside; }
155ol ol          { list-style-type: lower-alpha; }
156ol ol ol       { list-style-type: upper-roman; }
157ol ol ol ol    { list-style-type: upper-alpha; }
158ol ol ol ol ol { list-style-type: lower-roman; }
159
160
161/*____________ tables ____________*/
162
163table {
164    border-collapse: collapse;
165    empty-cells: show;
166    border-spacing: 0;
167    border: 1px solid @ini_border;
168}
169
170caption {
171    caption-side: top;
172    text-align: left;
173}
174[dir=rtl] caption {
175    text-align: right;
176}
177
178th,
179td {
180    padding: .3em .5em;
181    margin: 0;
182    vertical-align: top;
183    border: 1px solid @ini_border;
184}
185th {
186    font-weight: bold;
187    color: #ddd;
188    background-color: @ini_text_alt;
189    text-align: left;
190}
191[dir=rtl] th {
192    text-align: right;
193}
194
195
196/*____________ links ____________*/
197
198a {
199    outline: none;
200}
201a:link,
202a:visited {
203    text-decoration: none;
204    color: @ini_link;
205}
206a:link:hover,
207a:visited:hover,
208a:link:focus,
209a:visited:focus,
210a:link:active,
211a:visited:active {
212    text-decoration: underline;
213}
214
215
216
217/*____________ misc ____________*/
218
219img {
220    border-width: 0;
221    vertical-align: middle;
222    color: #666;
223    background-color: transparent;
224    font-style: italic;
225    height: auto;
226}
227video {
228    height: auto;
229}
230img,
231object,
232embed,
233iframe,
234video,
235audio {
236    max-width: 100%;
237}
238button img {
239    max-width: none;
240}
241
242hr {
243    border-top: solid @ini_border;
244    border-bottom: solid @ini_background;
245    border-width: 1px 0;
246    height: 0;
247    text-align: center;
248    clear: both;
249}
250
251acronym,
252abbr {
253    cursor: help;
254    border-bottom: 1px dotted;
255    font-style: normal;
256}
257em acronym,
258em abbr {
259    font-style: italic;
260}
261
262mark {
263    background-color: @ini_highlight;
264    color: inherit;
265}
266
267pre,
268code,
269samp,
270kbd {
271    font-family: Consolas, "Andale Mono WT", "Andale Mono", "Bitstream Vera Sans Mono", "Nimbus Mono L", Monaco, "Courier New", monospace;
272    /* same font stack should be used for ".dokuwiki table.diff td" in _diff.css */
273    font-size: 1em;
274    direction: ltr;
275    text-align: left;
276    background-color: @ini_background_site;
277    color: @ini_text;
278    //box-shadow: inset 0 0 .3em @ini_background_alt;
279    border: 1px solid #000;
280    border-radius: 2px;
281}
282pre {
283    overflow: auto;
284    word-wrap: normal;
285    border: 1px solid @ini_border;
286    border-radius: 2px;
287    box-shadow: inset 0 0 .5em @ini_border;
288    padding: .7em 1em;
289}
290
291blockquote {
292    padding: 0 .5em;
293    border: solid @ini_border;
294    border-width: 0 0 0 .25em;
295}
296[dir=rtl] blockquote {
297    border-width: 0 .25em 0 0;
298}
299q:before,
300q:after {
301    content: '';
302}
303
304sub,
305sup {
306    font-size: .8em;
307    line-height: 1;
308}
309sub {
310    vertical-align: sub;
311}
312sup {
313    vertical-align: super;
314}
315
316small {
317    font-size: .8em;
318}
319
320/*____________ forms ____________*/
321
322/* for all of the form styles, style.ini colours are not used on purpose (except for fieldset border) */
323
324form {
325    display: inline;
326    margin: 0;
327    padding: 0;
328}
329fieldset {
330    padding: .7em 1em 0;
331    padding: .7rem 1rem; /* for those browsers understanding :last-child */
332    border: 1px solid @ini_text_alt;
333}
334fieldset > :last-child {
335    margin-bottom: 0;
336}
337legend {
338    margin: 0;
339    padding: 0 .1em;
340}
341label {
342    vertical-align: middle;
343    cursor: pointer;
344}
345
346input,
347textarea,
348button,
349select,
350optgroup,
351option,
352keygen,
353output,
354meter,
355progress {
356    font: inherit;
357    font-weight: normal;
358    color: #eee;
359    //background-color: #474749; //firefox address bar
360    background-color: #444;
361    line-height: normal;
362    margin: 0;
363    vertical-align: middle;
364    box-sizing: border-box;
365}
366
367select {
368    max-width: 100%;
369}
370optgroup {
371    font-style: italic;
372    font-weight: bold;
373}
374option {
375    font-style: normal;
376    font-weight: normal;
377}
378
379input,
380textarea,
381select,
382keygen {
383    border: 1px solid #333; //666
384    //box-shadow: inset 0 0 1px #eee;
385    border-radius: 3px;
386}
387input:active,
388input:focus,
389textarea:active,
390textarea:focus,
391select:active,
392select:focus,
393keygen:active,
394keygen:focus {
395    border-color: #999;
396}
397input[type=radio],
398input[type=checkbox],
399input[type=image] {
400    padding: 0;
401    border-style: none;
402    box-shadow: none;
403}
404
405/* all types of buttons */
406input[type=submit],
407input[type=button],
408input[type=reset],
409input.button,
410a.button,
411button,
412.qq-upload-button {
413    color: #000;
414    background-color: #444;
415    //background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MjQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0NDQ0NDQyIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnODI0KSIgLz4KPC9zdmc+);
416    background-image: linear-gradient(to bottom, #666 0%, #444 90%);
417    border: 1px solid #000;
418    border-radius: 2px;
419    padding: .1em .5em;
420    cursor: pointer;
421}
422
423input[type=submit]:hover,
424input[type=submit]:active,
425input[type=submit]:focus,
426input[type=button]:hover,
427input[type=button]:active,
428input[type=button]:hover,
429input[type=reset]:hover,
430input[type=reset]:active,
431input[type=reset]:hover,
432input.button:hover,
433input.button:active,
434input.button:focus,
435a.button:hover,
436a.button:active,
437a.button:focus,
438button:hover,
439button:active,
440button:focus,
441.qq-upload-button:hover {
442    border-color: #1b1b1b;
443    background-color: #333;
444    //background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2NzAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNGRkZGRkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiNGNEY0RjQiIG9mZnNldD0iMC4zIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0RERERERCIgb2Zmc2V0PSIwLjk5Ii8+PHN0b3Agc3RvcC1jb2xvcj0iI0JCQkJCQiIgb2Zmc2V0PSIuOTkiLz4KPC9saW5lYXJHcmFkaWVudD4KPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNnNjcwKSIgLz4KPC9zdmc+);
445    //background-image: linear-gradient(to bottom, #ffffff 0%, #f4f4f4 30%, #dddddd 99%, #bbbbbb 99%);
446    background-image: linear-gradient(to bottom, #777 0%, #444 90%);
447}
448
449input::-moz-focus-inner,
450button::-moz-focus-inner {
451    border: 0;
452    padding: 0;
453}
454
455input[disabled],
456button[disabled],
457select[disabled],
458textarea[disabled],
459option[disabled],
460input[readonly],
461button[readonly],
462select[readonly],
463textarea[readonly] {
464    cursor: auto;
465    opacity: .5;
466    //background-color: #eee;
467}
468
469#config__manager fieldset {
470    background-color: #111;
471}
472
473#extension__manager .panelHeader,
474#mediamanager__page div.panelHeader {
475    background-color: #333;
476}
477#extension__manager ul.tabs li.active a ,
478#mediamanager__page div.namespaces h2 {
479	background-color: #333;
480}
481.dokuwiki div.panel ul.tabs li strong {
482	color: #1b1b1b;
483}
484#media__content div.odd {
485	color: #1b1b1b;
486}
487#extension__manager ul.tabs li a:hover  {
488	color: #000;
489}
490#extension__manager ul.tabs li.active a:hover  {
491	color: #aaa;
492}
493