git.oblomov.eu Git - ikiwiki/blob - doc/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: 140%;
  18         font-weight: bold;
  19         line-height: 1em;
  20         display: block;
  21 }
  22
  23 .inlineheader .author {
  24         margin: 0;
  25         font-size: 112%;
  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 .inlineenclosure {
  63         margin-top: .4em;
  64 }
  65
  66 .pagefooter,
  67 .inlinefooter,
  68 .comments {
  69         clear: both;
  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 .recentchanges .revert {
 178         float: right;
 179         margin: 0;
 180         width: 60%;
 181 }
 182
 183 .blogform, #blogform {
 184         padding: 10px 10px;
 185         border: 1px solid #aaa;
 186         background: #eee;
 187         color: black !important;
 188         width: auto;
 189         overflow: auto;
 190 }
 191
 192 .inlinepage {
 193         padding: 10px 10px;
 194         border: 1px solid #aaa;
 195         overflow: auto;
 196 }
 197
 198 .pagedate,
 199 .pagelicense,
 200 .pagecopyright {
 201         font-style: italic;
 202         display: block;
 203         margin-top: 1em;
 204 }
 205
 206 .archivepagedate {
 207         font-style: italic;
 208 }
 209 .archivepage {
 210         margin-bottom: 1em;
 211 }
 212
 213 .error {
 214         color: #C00;
 215 }
 216
 217 .sidebar {
 218         width: 20ex;
 219         float: right;
 220         margin-left: 4px;
 221         margin-bottom: 4px;
 222         margin-top: -1px;
 223         padding: 0ex 2ex;
 224         background: white;
 225         border: 1px solid black;
 226         color: black !important;
 227 }
 228
 229 hr.poll {
 230         height: 10pt;
 231         color: white !important;
 232         background: #eee;
 233         border: 2px solid black;
 234 }
 235 div.poll {
 236         margin-top: 1ex;
 237         margin-bottom: 1ex;
 238         padding: 1ex 1ex;
 239         border: 1px solid #aaa;
 240 }
 241
 242 span.color {
 243         padding: 2px;
 244 }
 245
 246 .comment-header,
 247 .microblog-header {
 248         font-style: italic;
 249         margin-top: .3em;
 250 }
 251 .comment .author,
 252 .microblog .author {
 253         font-weight: bold;
 254 }
 255 .comment-subject {
 256         font-weight: bold;
 257 }
 258 .comment-avatar {
 259         float: right;
 260 }
 261 .comment {
 262         border: 1px solid #aaa;
 263         padding: 3px;
 264 }
 265
 266 div.progress {
 267         margin-top: 1ex;
 268         margin-bottom: 1ex;
 269         border: 1px solid #888;
 270         width: 400px;
 271         background: #eee;
 272         color: black !important;
 273         padding: 1px;
 274 }
 275 div.progress-done {
 276         background: #ea6 !important;
 277         color: black !important;
 278         text-align: center;
 279         padding: 1px;
 280 }
 281
 282 /* things to hide in printouts */
 283 @media print {
 284         .actions { display: none; }
 285         .tags { display: none; }
 286         .trails { display: none; }
 287         .feedbutton { display: none; }
 288         #searchform { display: none; }
 289         .blogform, #blogform { display: none; }
 290         #backlinks { display: none; }
 291 }
 292
 293 /* infobox template */
 294 .infobox {
 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         background: white;
 302         color: black !important;
 303 }
 304
 305 /* notebox template */
 306 .notebox {
 307         float: right;
 308         margin-left: 2ex;
 309         margin-top: 1ex;
 310         margin-bottom: 1ex;
 311         padding: 1ex 1ex;
 312         border: 1px solid #aaa;
 313         width: 25%;
 314         background: white;
 315         color: black !important;
 316 }
 317
 318 /* popup template and backlinks hiding */
 319 .popup {
 320         border-bottom: 1px dotted #366;
 321         color: #366;
 322 }
 323 .popup .balloon,
 324 .popup .paren,
 325 .popup .expand {
 326         display: none;
 327         text-align: left;
 328 }
 329 .popup:hover .balloon,
 330 .popup:focus .balloon {
 331         position: absolute;
 332         display: inline;
 333         margin: 1em 0 0 -2em;
 334         padding: 0.625em;
 335         border: 2px solid;
 336         background-color: #dee;
 337         color: black;
 338 }
 339
 340 /* form styling */
 341 fieldset {
 342         margin: 1ex 0;
 343         border: 1px solid black;
 344 }
 345 legend {
 346         padding: 0 1ex;
 347 }
 348 .fb_submit {
 349         float: left;
 350         margin: 2px 0;
 351 }
 352 label.block {
 353         display: block;
 354 }
 355 label.inline {
 356         display: inline;
 357 }
 358 input#openid_identifier {
 359         background: url(wikiicons/openidlogin-bg.gif) no-repeat;
 360         background-color: #fff;
 361         background-position: 0 50%;
 362         color: #000;
 363         padding-left: 18px;
 364 }
 365 input#searchbox {
 366         background: url(wikiicons/search-bg.gif) no-repeat;
 367         background-color: #fff;
 368         background-position: 100% 50%;
 369         color: #000;
 370         padding-right: 16px;
 371 }
 372 /* invalid form fields */
 373 .fb_invalid {
 374         color: red;
 375         background: white !important;
 376 }
 377 /* required form fields */
 378 .fb_required {
 379         font-weight: bold;
 380 }
 381
 382 /* highlight plugin */
 383 pre.hl { color:#000000; background-color:#ffffff; }
 384 .hl.num { color:#2928ff; }
 385 .hl.esc { color:#ff00ff; }
 386 .hl.str { color:#ff0000; }
 387 .hl.dstr { color:#818100; }
 388 .hl.slc { color:#838183; font-style:italic; }
 389 .hl.com { color:#838183; font-style:italic; }
 390 .hl.dir { color:#008200; }
 391 .hl.sym { color:#000000; }
 392 .hl.line { color:#555555; }
 393 .hl.mark { background-color:#ffffbb; }
 394 .hl.kwa { color:#000000; font-weight:bold; }
 395 .hl.kwb { color:#830000; }
 396 .hl.kwc { color:#000000; font-weight:bold; }
 397 .hl.kwd { color:#010181; }
 398
 399 /* calendar plugin */
 400 .month-calendar-day-this-day,
 401 .year-calendar-this-month {
 402         background-color: #eee;
 403 }
 404 .month-calendar-day-head,
 405 .month-calendar-day-nolink,
 406 .month-calendar-day-link,
 407 .month-calendar-day-this-day,
 408 .month-calendar-day-future {
 409         text-align: right;
 410 }
 411 .month-calendar-arrow A:link,
 412 .year-calendar-arrow A:link,
 413 .month-calendar-arrow A:visited,
 414 .year-calendar-arrow A:visited {
 415         text-decoration: none;
 416         font-weight: normal;
 417         font-size: 150%;
 418 }
 419
 420 /* outlines */
 421 li.L1 { list-style: upper-roman; }
 422 li.L2 { list-style: decimal; }
 423 li.L3 { list-style: lower-alpha; }
 424 li.L4 { list-style: disc; }
 425 li.L5 { list-style: square; }
 426 li.L6 { list-style: circle; }
 427 li.L7 { list-style: lower-roman; }
 428 li.L8 { list-style: upper-alpha; }
 429
 430 /* tag cloud */
 431 .pagecloud {
 432         float: right;
 433         width: 30%;
 434         text-align: center;
 435         padding: 10px 10px;
 436         border: 1px solid #aaa;
 437         background: #eee;
 438         color: black !important;
 439 }
 440 .smallestPC { font-size: 70%; }
 441 .smallPC { font-size: 85%; }
 442 .normalPC { font-size: 100%; }
 443 .bigPC { font-size: 115%; }
 444 .biggestPC { font-size: 130%; }
 445
 446 /* orange feed button */
 447 .feedbutton {
 448         background: #ff6600;
 449         color: white !important;
 450         border-left: 1px solid #cc9966;
 451         border-top: 1px solid #ccaa99;
 452         border-right: 1px solid #993300;
 453         border-bottom: 1px solid #331100;
 454         padding: 0px 0.5em 0px 0.5em;
 455         font-family: sans-serif;
 456         font-weight: bold;
 457         font-size: small;
 458         text-decoration: none;
 459         margin-top: 1em;
 460 }
 461 .feedbutton:hover {
 462         color: white !important;
 463         background: #ff9900;
 464 }
 465
 466 .FlattrButton {
 467         display: none;
 468 }
 469
 470 /* openid selector */
 471 #openid_choice {
 472         display: none;
 473 }
 474 #openid_input_area {
 475         clear: both;
 476         padding: 10px;
 477 }
 478 #openid_btns, #openid_btns br {
 479         clear: both;
 480 }
 481 #openid_highlight {
 482         background-color: black;
 483         float: left;
 484 }
 485 .openid_large_btn {
 486         padding: 1em 1.5em;
 487         border: 1px solid #DDD;
 488         margin: 3px;
 489         float: left;
 490 }
 491 .openid_small_btn {
 492         padding: 4px 4px;
 493         border: 1px solid #DDD;
 494         margin: 3px;
 495         float: left;
 496 }
 497 a.openid_large_btn:focus {
 498         outline: none;
 499 }
 500 a.openid_large_btn:focus {
 501         outline-style: none;
 502 }
 503 .openid_selected {
 504         border: 4px solid #DDD;
 505 }
 506
 507 .fileupload-content .ui-progressbar {
 508         width: 200px;
 509         height: 20px;
 510 }
 511 .fileupload-content .ui-progressbar-value {
 512         background: url(ikiwiki/images/pbar-ani.gif);
 513 }
 514
 515 .trails {
 516         margin-top: 1em;
 517         margin-bottom: 1em;
 518 }
 519 .trail {
 520         display: block;
 521         clear: both;
 522         position: relative;
 523 }
 524
 525 .trailprev {
 526         display: block;
 527         text-align: left;
 528         position: absolute;
 529         top: 0%;
 530         left: 3%;
 531         width: 30%;
 532 }
 533
 534 .trailup {
 535         display: block;
 536         text-align: center;
 537         margin-left: 35%;
 538         margin-right: 35%;
 539 }
 540
 541 .trailnext {
 542         display: block;
 543         text-align: right;
 544         position: absolute;
 545         top: 0%;
 546         width: 30%;
 547         right: 3%;
 548 }
 549
 550 .trailsep {
 551         display: none;
 552 }