local.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         margin-top: .4em;
  63 }
  64
  65 .pagefooter,
  66 .inlinefooter,
  67 .comments {
  68         clear: both;
  69 }
  70
  71 #pageinfo {
  72         margin: 1em 0;
  73         border-top: 1px solid #000;
  74 }
  75
  76 .tags {
  77         margin-top: 1em;
  78 }
  79
  80 .inlinepage .tags {
  81         display: inline;
  82 }
  83
  84 .mapparent {
  85         text-decoration: none;
  86 }
  87
  88 .img caption {
  89         font-size: 80%;
  90         caption-side: bottom;
  91         text-align: center;
  92 }
  93
  94 img.img {
  95         margin: 0.5ex;
  96 }
  97
  98 .align-left {
  99         float:left;
 100 }
 101
 102 .align-right {
 103         float:right;
 104 }
 105
 106 #backlinks {
 107         margin-top: 1em;
 108 }
 109
 110 #searchform {
 111         display: inline;
 112         float: right;
 113 }
 114
 115 #editcontent {
 116         width: 98%;
 117 }
 118
 119 .editcontentdiv {
 120         width: auto;
 121         overflow: auto;
 122 }
 123
 124 img {
 125         border-style: none;
 126 }
 127
 128 pre {
 129         overflow: auto;
 130 }
 131
 132 div.recentchanges {
 133         border-style: solid;
 134         border-width: 1px;
 135         overflow: auto;
 136         width: auto;
 137         clear: none;
 138         background: #eee;
 139         color: black !important;
 140 }
 141 .recentchanges .metadata {
 142         padding: 0px 0.5em;
 143 }
 144 .recentchanges .changelog {
 145         font-style: italic;
 146         clear: both;
 147         display: block;
 148         padding: 1px 2px;
 149         background: white !important;
 150         color: black !important;
 151 }
 152 .recentchanges .desc {
 153         display: none;
 154 }
 155 .recentchanges .diff {
 156         display: none;
 157 }
 158 .recentchanges .committer {
 159         float: left;
 160         margin: 0;
 161         width: 40%;
 162 }
 163 .recentchanges .committype {
 164         float: left;
 165         margin: 0;
 166         width: 5%;
 167         font-size: small;
 168 }
 169 .recentchanges .changedate {
 170         float: left;
 171         margin: 0;
 172         width: 35%;
 173         font-size: small;
 174 }
 175 .recentchanges .pagelinks,
 176 .recentchanges .revert {
 177         float: right;
 178         margin: 0;
 179         width: 60%;
 180 }
 181
 182 .blogform, #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         width: 4ex;
 212         float: right;
 213         margin-left: 4px;
 214         margin-bottom: 4px;
 215         margin-top: -1px;
 216         padding: 0ex 2ex;
 217         background: white;
 218         border: 1px solid black;
 219         color: black !important;
 220 }
 221
 222 hr.poll {
 223         height: 10pt;
 224         color: white !important;
 225         background: #eee;
 226         border: 2px solid black;
 227 }
 228 div.poll {
 229         margin-top: 1ex;
 230         margin-bottom: 1ex;
 231         padding: 1ex 1ex;
 232         border: 1px solid #aaa;
 233 }
 234
 235 span.color {
 236         padding: 2px;
 237 }
 238
 239 .comment-header,
 240 .microblog-header {
 241         font-style: italic;
 242         margin-top: .3em;
 243 }
 244 .comment .author,
 245 .microblog .author {
 246         font-weight: bold;
 247 }
 248 .comment-subject {
 249         font-weight: bold;
 250 }
 251 .comment {
 252         border: 1px solid #aaa;
 253         padding: 3px;
 254 }
 255
 256 div.progress {
 257         margin-top: 1ex;
 258         margin-bottom: 1ex;
 259         border: 1px solid #888;
 260         width: 400px;
 261         background: #eee;
 262         color: black !important;
 263         padding: 1px;
 264 }
 265 div.progress-done {
 266         background: #ea6 !important;
 267         color: black !important;
 268         text-align: center;
 269         padding: 1px;
 270 }
 271
 272 /* things to hide in printouts */
 273 @media print {
 274         .actions { display: none; }
 275         .tags { display: none; }
 276         .feedbutton { display: none; }
 277         #searchform { display: none; }
 278         .blogform, #blogform { display: none; }
 279         #backlinks { display: none; }
 280 }
 281
 282 /* infobox template */
 283 .infobox {
 284         float: right;
 285         margin-left: 2ex;
 286         margin-top: 1ex;
 287         margin-bottom: 1ex;
 288         padding: 1ex 1ex;
 289         border: 1px solid #aaa;
 290         background: white;
 291         color: black !important;
 292 }
 293
 294 /* notebox template */
 295 .notebox {
 296         float: right;
 297         margin-left: 2ex;
 298         margin-top: 1ex;
 299         margin-bottom: 1ex;
 300         padding: 1ex 1ex;
 301 /* orig
 302         border: 1px solid #aaa;
 303         width: 25%;
 304 */
 305         border: 1px solid #999;
 306         width: 1%;
 307         background: white;
 308         color: black !important;
 309 }
 310
 311 /* popup template and backlinks hiding */
 312 .popup {
 313         border-bottom: 1px dotted #366;
 314         color: #366;
 315 }
 316 .popup .balloon,
 317 .popup .paren,
 318 .popup .expand {
 319         display: none;
 320 }
 321 .popup:hover .balloon,
 322 .popup:focus .balloon {
 323         position: absolute;
 324         display: inline;
 325         margin: 1em 0 0 -2em;
 326         padding: 0.625em;
 327         border: 2px solid;
 328         background-color: #dee;
 329         color: black;
 330 }
 331
 332 /* form styling */
 333 fieldset {
 334         margin: 1ex 0;
 335         border: 1px solid black;
 336 }
 337 legend {
 338         padding: 0 1ex;
 339 }
 340 .fb_submit {
 341         float: left;
 342         margin: 2px 0;
 343 }
 344 label.block {
 345         display: block;
 346 }
 347 label.inline {
 348         display: inline;
 349 }
 350 input#openid_identifier {
 351         background: url(wikiicons/openidlogin-bg.gif) no-repeat;
 352         background-color: #fff;
 353         background-position: 0 50%;
 354         color: #000;
 355         padding-left: 18px;
 356 }
 357 input#searchbox {
 358         background: url(wikiicons/search-bg.gif) no-repeat;
 359         background-color: #fff;
 360         background-position: 100% 50%;
 361         color: #000;
 362         padding-right: 16px;
 363 }
 364 /* invalid form fields */
 365 .fb_invalid {
 366         color: red;
 367         background: white !important;
 368 }
 369 /* required form fields */
 370 .fb_required {
 371         font-weight: bold;
 372 }
 373
 374 /* highlight plugin */
 375 pre.hl { color:#000000; background-color:#ffffff; }
 376 .hl.num { color:#2928ff; }
 377 .hl.esc { color:#ff00ff; }
 378 .hl.str { color:#ff0000; }
 379 .hl.dstr { color:#818100; }
 380 .hl.slc { color:#838183; font-style:italic; }
 381 .hl.com { color:#838183; font-style:italic; }
 382 .hl.dir { color:#008200; }
 383 .hl.sym { color:#000000; }
 384 .hl.line { color:#555555; }
 385 .hl.mark { background-color:#ffffbb; }
 386 .hl.kwa { color:#000000; font-weight:bold; }
 387 .hl.kwb { color:#830000; }
 388 .hl.kwc { color:#000000; font-weight:bold; }
 389 .hl.kwd { color:#010181; }
 390
 391 /* calendar plugin */
 392 .month-calendar-day-this-day,
 393 .year-calendar-this-month {
 394         background-color: #eee;
 395 }
 396 .month-calendar-day-head,
 397 .month-calendar-day-nolink,
 398 .month-calendar-day-link,
 399 .month-calendar-day-this-day,
 400 .month-calendar-day-future {
 401         text-align: right;
 402 }
 403 .month-calendar-arrow A:link,
 404 .year-calendar-arrow A:link,
 405 .month-calendar-arrow A:visited,
 406 .year-calendar-arrow A:visited {
 407         text-decoration: none;
 408         font-weight: normal;
 409         font-size: 150%;
 410 }
 411
 412 /* outlines */
 413 li.L1 { list-style: upper-roman; }
 414 li.L2 { list-style: decimal; }
 415 li.L3 { list-style: lower-alpha; }
 416 li.L4 { list-style: disc; }
 417 li.L5 { list-style: square; }
 418 li.L6 { list-style: circle; }
 419 li.L7 { list-style: lower-roman; }
 420 li.L8 { list-style: upper-alpha; }
 421
 422 /* tag cloud */
 423 .pagecloud {
 424         float: right;
 425         width: 30%;
 426         text-align: center;
 427         padding: 10px 10px;
 428         border: 1px solid #aaa;
 429         background: #eee;
 430         color: black !important;
 431 }
 432 .smallestPC { font-size: 70%; }
 433 .smallPC { font-size: 85%; }
 434 .normalPC { font-size: 100%; }
 435 .bigPC { font-size: 115%; }
 436 .biggestPC { font-size: 130%; }
 437
 438 /* orange feed button */
 439 .feedbutton {
 440         background: #ff6600;
 441         color: white !important;
 442         border-left: 1px solid #cc9966;
 443         border-top: 1px solid #ccaa99;
 444         border-right: 1px solid #993300;
 445         border-bottom: 1px solid #331100;
 446         padding: 0px 0.5em 0px 0.5em;
 447         font-family: sans-serif;
 448         font-weight: bold;
 449         font-size: small;
 450         text-decoration: none;
 451         margin-top: 1em;
 452 }
 453 .feedbutton:hover {
 454         color: white !important;
 455         background: #ff9900;
 456 }
 457
 458 .FlattrButton {
 459         display: none;
 460 }
 461
 462 /* openid selector */
 463 #openid_choice {
 464         display: none;
 465 }
 466 #openid_input_area {
 467         clear: both;
 468         padding: 10px;
 469 }
 470 #openid_btns, #openid_btns br {
 471         clear: both;
 472 }
 473 #openid_highlight {
 474         background-color: black;
 475         float: left;
 476 }
 477 .openid_large_btn {
 478         padding: 1em 1.5em;
 479         border: 1px solid #DDD;
 480         margin: 3px;
 481         float: left;
 482 }
 483 .openid_small_btn {
 484         padding: 4px 4px;
 485         border: 1px solid #DDD;
 486         margin: 3px;
 487         float: left;
 488 }
 489 a.openid_large_btn:focus {
 490         outline: none;
 491 }
 492 a.openid_large_btn:focus {
 493         outline-style: none;
 494 }
 495 .openid_selected {
 496         border: 4px solid #DDD;
 497 }
 498 /*    bzed theme for ikiwiki
 499  *
 500  *    Copyright (C) 2010 Bernd Zeimetz
 501  *       Licensed under same license as ikiwiki: GPL v2 or later
 502  *
 503  *     Parts of this file are based on the awesome YUI,
 504  *     these parts will stay under the BSD license,
 505  *     but you're free to apply the GPLv2 to them, of course.
 506  */
 507
 508
 509
 510 /* -------------------------------------------------------------------------------------------------
 511 Based on reset-fonts-grids.css from yui.
 512 Copyright (c) 2008, Yahoo! Inc. All rights reserved.
 513 Code licensed under the BSD License:
 514 http://developer.yahoo.net/yui/license.txt
 515 version: 2.5.1
 516 */
 517 body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,legend,p,blockquote,th,td{margin:0;padding:0;}
 518 table{border-collapse:collapse;border-spacing:0;}
 519 img{border:0;}
 520 address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
 521 li{list-style:none;}
 522 caption,th{text-align:left;}
 523 h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
 524 q:before,q:after{content:'';}
 525 abbr,acronym {border:0;font-variant:normal;}
 526 sup {vertical-align:text-top;}
 527 sub {vertical-align:text-bottom;}
 528 input,textarea,select{font-family:inherit;font-size: 13px/1.23;font-weight:normal;}
 529 input,textarea,select{*font-size:100%;}
 530 legend{color:#000;}
 531 /* body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;} */
 532 body {font:13px/1.231 "Lucida Grande",Verdana,Lucida,Helvetica,Arial,sans-serif;*font-size:small;*font:x-small;}
 533 table {font-size:inherit;font:100%;}
 534 pre,code,kbd,samp,tt{font-family:monospace;}
 535
 536
 537 body{text-align:left;}
 538 .inlinefooter{clear:both;}
 539
 540 /* #doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7{margin:auto;text-align:left;width:57.69em;*width:56.25em;min-width:750px;} */
 541 /*
 542 .page {margin:auto;text-align:left;width:57.69em;*width:56.25em;min-width:750px;}
 543 */
 544 .page {
 545   margin:auto;
 546   text-align:left;
 547   min-width:750px;
 548   position:static;
 549 }
 550
 551 /* #doc3{margin:auto 10px;width:auto;} */
 552 /*
 553 .page {margin:auto 10px;width:auto;}
 554 */
 555
 556 #pagebody, .sidebar{position:relative;}
 557 #pagebody, .sidebar{_position:static;}
 558 #pagebody {position:static;}
 559 /* .sidebar {float:right;width:16.5em;*width:16em;} */
 560 .sidebar {float:right;width:1.5em;*width:1em;}
 561 /* #pagebody {margin-right:19em;*margin-right:18.5em;} */
 562 #pagebody {margin-right:1em;*margin-right:0.5em;}
 563 /* #content {float:none;width:auto;} */
 564 #pagebody:after, .sidebar:after, .page:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
 565 .page f{zoom:1;}
 566
 567 /* ------------------------------------------------------------------------------------------------
 568  * Taken from base.css, part of YUI's CSS Foundation
 569  * Copyright (c) 2008, Yahoo! Inc. All rights reserved.
 570  * Code licensed under the BSD License:
 571  * http://developer.yahoo.net/yui/license.txt
 572  * version: 2.5.1
 573 */
 574 h1 {
 575         /*18px via YUI Fonts CSS foundation*/
 576         font-size:138.5%;
 577 }
 578 h2 {
 579         /*16px via YUI Fonts CSS foundation*/
 580         font-size:123.1%;
 581 }
 582 h3 {
 583         /*14px via YUI Fonts CSS foundation*/
 584         font-size:108%;
 585 }
 586 h1,h2,h3 {
 587         /* top & bottom margin based on font size */
 588         margin:1em 0;
 589 }
 590 h1,h2,h3,h4,h5,h6,strong {
 591         /*bringing boldness back to headers and the strong element*/
 592         font-weight:bold;
 593 }
 594 abbr,acronym {
 595         /*indicating to users that more info is available */
 596         border-bottom:1px dotted #000;
 597         cursor:help;
 598 }
 599 em {
 600         /*bringing italics back to the em element*/
 601         font-style:italic;
 602 }
 603 blockquote,ul,ol,dl {
 604         /*giving blockquotes and lists room to breath*/
 605         margin:1em;
 606 }
 607 ol,ul,dl {
 608         /*bringing lists on to the page with breathing room */
 609         margin-left:2em;
 610 }
 611 ol li {
 612         /*giving OL's LIs generated numbers*/
 613         list-style: decimal outside;
 614 }
 615 ul li {
 616         /*giving UL's LIs generated disc markers*/
 617         list-style: disc outside;
 618 }
 619 dl dd {
 620         /*giving UL's LIs generated numbers*/
 621         margin-left:1em;
 622 }
 623 th,td {
 624         /*borders and padding to make the table readable*/
 625         border:1px solid #000;
 626         padding:.5em;
 627 }
 628 th {
 629         /*distinguishing table headers from data cells*/
 630         font-weight:bold;
 631         text-align:center;
 632 }
 633 caption {
 634         /*coordinated margin to match cell's padding*/
 635         margin-bottom:.5em;
 636         /*centered so it doesn't blend in to other content*/
 637         text-align:center;
 638 }
 639 p,fieldset,table,pre {
 640         /*so things don't run into each other*/
 641         margin-bottom:1em;
 642 }
 643
 644 #searchbox {
 645         width:21.5em;*width:21em;
 646 }
 647
 648
 649
 650 /* ------------------------------------------------------------------------------------------------
 651  * All CSS below is
 652  * Copyright (C) 2010 Bernd Zeimetz
 653  * Licensed under same license as ikiwiki: GPL v2 or later */
 654
 655 .page, .pageheader, .sidebar, #content, #comments, .inlinepage, .recentchanges, .pageheader .actions ul, #pagebody {
 656         border: none;
 657 }
 658
 659 html, body {
 660         color:#000;
 661         /* background-image: url('body_background.png');
 662         background-repeat: repeat; */
 663         /* background-color: #8da1b8; */
 664         /* background-color: #295382; matches blue */
 665         background-color: #123256;
 666 }
 667
 668 body {
 669         padding-left: 5%;
 670         padding-right: 5%;
 671         padding-top: 1em;
 672         padding-bottom: 1em;
 673 }
 674
 675 .page {
 676         background: #fff;
 677         border: outset #ccc;
 678         padding-left: 1em;
 679         padding-right: 1em;
 680         padding-top: 1em;
 681 }
 682
 683 .pageheader {
 684         background-image: url('header_background.png');
 685         background-repeat: repeat-x;
 686         height: 100px;
 687         padding-left: 1em;
 688         padding-right: 1em;
 689         padding-bottom: 1em;
 690         padding-top: 1em;
 691 }
 692
 693 .pageheader .header {
 694         text-align: top;
 695         clear: both;
 696 }
 697
 698 .pageheader .header form {
 699         padding: 0em 0em 0em 0em;
 700         float: right;
 701         margin-top: 0.5em;
 702 }
 703
 704 .pageheader .header .title, .pageheader .header .parentlinks,
 705  .inlinepage .inlineheader,
 706  h1, h2, h3, h4, h5, h6 {
 707         margin-top: 1em;
 708         font-weight: bold;
 709 }
 710
 711 .pageheader .header .title, .pageheader .header .parentlinks, .pageheader .actions ul li, .pageheader .header span, .pageheader #otherlanguages ul li {
 712         padding: 0.25em 0.25em 0.25em 0.25em;
 713         background-image: url('background_darkness.png');
 714         background-repeat: repeat;
 715         color: white;
 716 }
 717
 718 .pageheader .header span a, .pageheader .actions ul li a, .pageheader .header .parentlinks a, .pageheader #otherlanguages ul li a {
 719         color: white;
 720         text-decoration: none;
 721 }
 722
 723 .pageheader .actions {
 724         text-align: right;
 725         vertical-align: bottom;
 726         clear: both;
 727 }
 728
 729 #pagebody {
 730         padding-right: 1em;
 731         padding-bottom: 2em;
 732         /* border-right: ridge #eee; */
 733         clear: none;
 734 }
 735
 736 #content a, #comments a, .sidebar a {
 737         color: #315485;
 738         text-decoration: none;
 739         font-weight: bold;
 740 }
 741
 742 .sidebar h2 {
 743         border-bottom: ridge #eee;
 744         padding-right: 0;
 745 }
 746
 747 .sidebar .menu {
 748         margin-left: 1em;
 749 }
 750
 751
 752 .inlinepage, .recentchanges, div.recentchanges {
 753         clear: none !important;
 754         margin-bottom: 2em;
 755 }
 756
 757 .inlinefooter {
 758         border-top: 1px dotted #315485;
 759 }
 760
 761 .inlinefooter .pagedate, .inlinefooter .tags {
 762         display: inline;
 763         clear: none;
 764         margin-right: 2em;
 765 }
 766
 767 .calendar .month-calendar th, .calendar .month-calendar td {
 768         padding: 0.22em;
 769 }
 770
 771 @media print {
 772         .sidebar, .page .pageheader .header .parentlinks {
 773                 content:".";
 774                 display:block;
 775                 height:0;
 776                 visibility:hidden;
 777         }
 778         .page {
 779                 padding: 1em 1em 1em 1em;
 780         }
 781         .pageheader .header span a, .pageheader .actions ul li a, .pageheader .header .parentlinks a {
 782                 color #315485;
 783         }
 784         #content, #comments, #pagebody {
 785                 margin-right: 0;
 786                 *margin-right: 0;
 787                 border-right: none;
 788         }
 789
 790 }
 791