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