debwiki/css/debwiki.css

   1 /*
   2  *      wiki.debian.org stylesheet proposal
   3  *
   4  *      Kalle Söderman, 2008 debwiki.css
   5  *
   6  *      Copyleft : This work is free, you can copy, spread, and modify it under
   7  *      the terms of the Free Art License http://artlibre.org/licence/lal/en/
   8  *
   9  *
  10  *      Font size table
  11  *      ---------------
  12  *      Browser default 16px
  13  *
  14  *      14px    87.5%           body
  15  *      24px    1.714em
  16  *      18px    1.286em
  17  *      16px    1.143em
  18  *      12px    0.857em
  19  *      11px    0.75em
  20  *      8px     0.57em
  21  */
  22
  23 @import url("debian.css");
  24
  25 /*
  26  *      Header
  27  */
  28 body {
  29                 font-size: 100%;
  30 }
  31
  32 #breadcrumbs {
  33         text-transform: none;
  34 }
  35 #wikisection p.section{
  36         left: 0;
  37 }
  38 #wikisection {
  39         position: absolute;
  40         top: 0;
  41 }
  42 div#username {
  43         font-size: 0.75em;
  44         margin-left: 5em;
  45         color: #d2d3d7;
  46 }
  47 .sitetools {
  48         text-align:left;
  49         margin: 0 10px 0 0;
  50         padding: 2px 10px 2px 5px;
  51         position: absolute;
  52         top:0;
  53         right:0;
  54         border-right: 1px solid white;
  55         border-left: 1px solid #d2d3d7;
  56         line-height: 1em;
  57 }
  58
  59 #searchform {
  60         float: left;
  61         font-size: 0.75em;
  62         line-height: 2;
  63 }
  64
  65 #pagelocation {
  66 }
  67
  68
  69 #sitetools form {
  70         margin:0;
  71         padding:0;
  72 }
  73
  74 #sitetools input {
  75         margin: 0 0 0 0.25em;
  76         padding-left: 4px;
  77         padding-right: 4px;
  78 }
  79
  80 #sitetools select {
  81         margin-left: 0.5em;
  82 }
  83
  84 #sitetools form p {
  85         display: inline;
  86         line-height: 1em;
  87         margin:0;
  88         padding:0;
  89 }
  90
  91 .sitetools a {
  92         margin: 5px 0.5em 2px 0;
  93         padding: 0 0 0 0;
  94 }
  95
  96 .sitetools {
  97         margin:0;
  98         padding: 2px 10px 2px 5px;
  99         border-left: 1px solid white;
 100         border-right: 1px solid #d2d3d7;
 101         display:block;
 102         float:left;
 103 }
 104
 105 /*
 106  *      Leftcol (Should be renamed secondnav)
 107  */
 108
 109 #leftcol {
 110         float: right;
 111         margin: 2em 0 0 1em  ;
 112         width: 16em;
 113         clear: both;
 114 }
 115
 116 #leftcol a {
 117         display: block;
 118 }
 119
 120 #leftcol #username {
 121         margin: 0 0 1em 0;
 122         display:block;
 123 }
 124
 125 #userhome {
 126         font-weight: bold;
 127         margin-bottom: 1em;
 128 }
 129
 130 #navibar
 131 , .editbar {
 132         list-style: none;
 133         margin: 0;
 134         padding:0;
 135 }
 136
 137 #leftcol ul.editbar {
 138         margin-top: 1em;
 139 }
 140
 141 form select {
 142 }
 143
 144 #leftcol .editbar form select {
 145         width: 100%;
 146 }
 147
 148 .editbar {
 149         background: url('Pics/reddot.png') bottom left repeat-x;
 150         width: 100%;
 151         padding: 0 0 0.5em 0;
 152         font-size: 0.75em;
 153         line-height: 2;
 154 }
 155
 156 #leftcol li {
 157         display:block;
 158         margin:0;
 159         padding:0;
 160         list-style: none;
 161 }
 162
 163 #content {
 164         margin-top: 1.5em;
 165 }
 166
 167 .info {
 168         position: relative;
 169         margin:0 0 0.5em 0;
 170         float: none;
 171 }
 172 #leftcol .info a {
 173         display: inline;
 174 }
 175
 176 #leftcol .info strong {
 177         margin: 0;
 178         padding: 0;
 179 }
 180
 181 /*
 182  *      Typography
 183  */
 184
 185 hr {
 186         background-color: #d2d3d7;
 187         height: 1px;
 188 }
 189
 190 pre, div.codearea {
 191         padding: 1em;
 192         margin: 2em 1.5em 2em 1.5em;
 193         line-height: 1.5em;
 194         background-color: #f5f6f7;
 195         border: 1px solid #d2d3d7 ;
 196         font-family: monospace;
 197         font-size: 100%;
 198         line-height: 2em;
 199 }
 200 div.codearea pre {
 201                 border: none;
 202                 padding: 0;
 203                 margin: 0;
 204 }
 205 div.table-of-contents {
 206         font-size: 0.75em;
 207         line-height: 2em;
 208         list-style:none;
 209         background-image: url('../img/greydot.png');
 210         background-position: bottom left;
 211         background-repeat: repeat-x;
 212         background-color: transparent;
 213         padding: 0;
 214         margin:0;
 215         border:0;
 216         max-width: 50em;
 217         display:block;
 218 }
 219
 220 p.table-of-contents-heading {
 221         font-weight:bold;
 222         padding:0;
 223         margin:1.5em 0 0 0;
 224         font-size: 125%;
 225         letter-spacing: normal;
 226 }
 227
 228 div.table-of-contents ol {
 229         list-style-position: inside;
 230         padding:0;
 231         margin: 0;
 232 }
 233
 234 div.table-of-contents ol ol {
 235         list-style-position: inside;
 236         padding-left: 2em;
 237         margin: 0;
 238 }
 239
 240
 241 div.table-of-contents li {
 242         background-image: url('../img/greydot.png');
 243         background-position: top left;
 244         background-repeat: repeat-x;
 245         padding: 0;
 246         margin:0;
 247  }
 248
 249 div.table-of-contents a:hover {
 250         background-color: #f0f0f4;
 251 }
 252
 253 div.table-of-contents a {
 254         text-decoration: none;
 255 }
 256
 257 .portal h1 {
 258         margin-top: 0;
 259         line-height: 1em;
 260 }
 261
 262 .portal h1:after {
 263         content: "Portal";
 264         font-family:monospace;
 265         font-weight: normal;
 266         font-size: 0.62em;
 267         text-transform: uppercase;
 268         letter-spacing: 0.08em;
 269         background-color: #c70036;
 270         line-height: 16px;
 271         color:white;
 272         padding: 0 5px 0 5px;
 273         margin:1em 0 3em 0;
 274         display: block;
 275 }
 276 h1#locationline {
 277         margin-bottom: 0.5em;
 278 }
 279 h1#locationline a {
 280         color: black;
 281 }
 282 span.u {
 283                 font-style: normal;
 284                 font-weight: normal;
 285                 text-decoration: underline;
 286 }
 287 p.searchhint {
 288         padding:1em;
 289         border: 1px solid #cccca3;
 290         margin:1em 0 1em 0;
 291         background-color:#ffffcb;
 292         font-size: 0.75em;
 293         line-height: 2;
 294 }
 295 p.searchstats {
 296                 font-size: 0.75em;
 297                 background-color: transparent;
 298                 background-color: #f5f6f7;
 299                 margin:0;
 300                 border-top: 1px solid #d2d3d7 ;
 301                 text-transform:lowercase;
 302                 line-height: 2;
 303                 padding: 0;
 304 }
 305 div.codearea {
 306                 margin: 2em 1.5em 2em 1.5em;
 307                 font-family: monospace;
 308 }
 309 a.codenumbers {
 310                 font-size: 100%;
 311 }
 312
 313
 314 /*
 315  *      Footer
 316  */
 317
 318 p#pageinfo {
 319         color: gray;
 320         font-size: 0.75em;
 321         margin: 1em 0 0 62px;
 322 }
 323
 324 #footer {
 325         margin-top: 2em;
 326         margin-left: 61px;
 327         margin-right: 10px;
 328         clear: both;
 329 }
 330 #footer ul.editbar {
 331         font-size: 1em;
 332         border-bottom: 1px solid #d2d3d7;
 333         background-image: none;
 334         margin: 0 0 1.5em 0;
 335 }
 336
 337 ul#credits {
 338         margin: 1em 0 0 0;
 339         padding:0;
 340         font-size: 1em;
 341         line-height: 2;
 342 }
 343
 344 ul#credits li {
 345         list-style: none;
 346         display: inline;
 347         margin: 0 1em 0 0;
 348 }
 349
 350 #content div.caution
 351 , #content div.important
 352 , #content div.note
 353 , #content div.tip
 354 , #content div.warning {
 355         margin: 1em 0 1em 0;
 356 }
 357
 358 #message {
 359         background-color: #f5f6f7;
 360         padding: 1em;
 361         margin: 1em 0 1em 0;
 362         border: 1px solid #d2d3d7 ;
 363         font-size: 0.75em;
 364         line-height: 2;
 365 }
 366
 367 #message p {
 368         margin:0;
 369         padding:0;
 370 }
 371
 372 table   {
 373         margin: 0.75em 0 0.75em 0;
 374 }
 375 td {
 376                 padding: 0 1em 0 0.5em;
 377 }
 378
 379 #content div.debian {
 380         border:1px solid #c70036;
 381         border-top: 1px solid  #c70036;
 382         background-repeat: no-repeat;
 383         background-position: 10px 5px;
 384         margin: 2em 1.5em 2em 1.5em;
 385         padding: 0 1.5em 0 50px;
 386         font-size: 0.75em;
 387 }
 388 #content div.debian p {
 389                 margin: 1.5em  0 1.5em 0;
 390 }
 391
 392 /*
 393  * Editor
 394  */
 395
 396 #editor #editor-textarea {
 397         display: block;
 398         margin: 1em 0 1em 0;
 399 }
 400 p img.attachment {
 401                 float: left;
 402                 padding-right: 1.5em;
 403 }
 404 table p img.attachment {
 405                 display: inline;
 406                 float: none;
 407                 padding: 0;
 408 }
 409 p img {
 410                 display: inline;
 411 }
 412 table.diff {
 413         font-family: monospace;
 414         font-size: 1em;
 415 }
 416 div#header ul li {
 417         display: inline;
 418         margin-right: 1em;
 419 }
 420 ul#navibar li.wikilink {
 421         margin: 0;
 422 }
 423 ul#navibar li.current {
 424         display: none;
 425 }
 426 li.wikilink {
 427         margin:0;
 428         padding:0;
 429 }
 430 ul#navibar li.userlink {
 431         margin:0;
 432         padding:0;
 433 }
 434 #pagetrail {
 435         margin:0;
 436         font-size: 0.75em;
 437         text-transform: lowercase;
 438         line-height: 2;
 439         background-color: transparent;
 440         background-color: #f5f6f7;
 441         border-bottom: 1px solid #d2d3d7 ;
 442         min-height: 20px;
 443 }
 444 #pagetrail:before {
 445         content: "/";
 446         margin-left: 0.5em;
 447         margin-right: 0.5em;
 448 }
 449 #searchform {
 450         position: absolute;
 451         right: 10px;
 452         top: 0;
 453 }
 454 div#content {
 455         margin: 0 10px 0 61px;
 456 }
 457 div#header {
 458         margin:0;
 459 }
 460 #navbar {
 461         background-color: transparent;
 462         list-style:none;
 463         display:block;
 464         border-bottom:1px solid #c70036;
 465         text-indent:0;
 466         padding: 0;
 467         margin-top:0;
 468         margin-bottom:0;
 469 }
 470 #navbar ul {
 471         margin: 0;
 472         padding: 0;
 473         clear: both;
 474         overflow: hidden;
 475         min-height: 45px;
 476 }
 477 #navbar li {
 478         list-style: none;
 479         float: left;
 480         padding: 0;
 481         margin: 0;
 482 }
 483 #navbar a:link
 484 , #navbar a:visited {
 485         padding: 1.75em 1em 0.25em 1em;
 486         border-left: 1px solid transparent;
 487         border-right: 1px solid transparent;
 488         display: block;
 489         text-decoration: none;
 490 }
 491 #navbar a:visited {
 492         color: #54638c;
 493 }
 494 #navbar a:hover
 495 , #navbar a:visited:hover {
 496         background-color: #efefef;
 497         border-left: 1px solid  #d2d3d7;
 498         border-right: 1px solid #d2d3d7;
 499         text-decoration: underline;
 500 }
 501 form.actionsmenu {
 502         float: right;
 503         vertical-align: text-top;
 504 }
 505 span.sep {
 506         margin-right: 0.5em;
 507         margin-left: 0.5em;
 508 }
 509 td.diff-added {
 510         color: #31a300;
 511 }
 512 td.diff-removed {
 513         color: #c70036;
 514 }
 515 div#domaintools {
 516         position: absolute;
 517         top: 0;
 518         left: 0;
 519 }
 520 div#domaintools  p.section {
 521         margin: 0;
 522 }
 523 div#domaintools  div#username {
 524         line-height: 1.5em;
 525         margin-left: 10em;
 526         top:0;
 527 }