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