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