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