doc/cups.css

   1 /* Layout CSS */
   2 .header {
   3   background: #333333;
   4   color: white;
   5   float: left;
   6   left: 0;
   7   margin-bottom: 20px;
   8   padding: 0px;
   9   position: relative;
  10   right: 0;
  11   width: 100%;
  12 }
  13 .header ul {
  14   list-style: none;
  15   -webkit-margin-before: 0;
  16   -webkit-margin-after: 0;
  17   -webkit-margin-start: 0;
  18   -webkit-margin-end: 5px;
  19   -webkit-padding-start: 0;
  20 }
  21 .header ul li {
  22   float: left;
  23 }
  24 .header a {
  25   display: block;
  26   padding: 5px 10px !important;
  27 }
  28 .header a:link, .header a:visited {
  29   color: white !important;
  30   text-decoration: none !important;
  31 }
  32 .header a:hover {
  33   background: #cccccc !important;
  34   color: #333333 !important;
  35   text-decoration: none !important;
  36 }
  37 .header a.active {
  38   background: white !important;
  39   color: black !important;
  40   text-decoration: none !important;
  41 }
  42
  43 .body {
  44   padding: 20px 20px 40px;
  45 }
  46
  47 .footer {
  48   background: #333333;
  49   bottom: 0;
  50   color: #cccccc;
  51   font-size: 10px;
  52   height: 20px;
  53   left: 0;
  54   padding: 10px 10px 3px;
  55   position: fixed;
  56   width: 100%;
  57 }
  58 .footer a:link, footer a:hover, .footer a:visited {
  59   color: white !important;
  60   text-decoration: none !important;
  61 }
  62
  63 .row {
  64   width: 100%;
  65   *zoom: 1;
  66 }
  67 .row:after {
  68   clear: both;
  69 }
  70
  71 .row .thirds {
  72   float: left;
  73   margin-left: 0.5%;
  74   margin-right: 0;
  75   width: 33%;
  76 }
  77 .row .thirds:first-child {
  78   margin-left: 0;
  79 }
  80
  81 .row .halves {
  82   float: left;
  83   margin-left: 0.5%;
  84   margin-right: 0;
  85   width: 49.75%;
  86 }
  87 .row .halves:first-child {
  88   margin-left: 0;
  89 }
  90 .mobile {
  91   display: none;
  92 }
  93 .no-mobile {
  94   display: inherit;
  95 }
  96
  97 /* Appearance CSS */
  98 BODY {
  99   background: white;
 100   color: black;
 101   font-family: lucida grande, geneva, helvetica, arial, sans-serif;
 102   margin: 0;
 103 }
 104
 105 H1, H2, H3, H4, H5, H6, P, TD, TH {
 106   font-family: lucida grande, geneva, helvetica, arial, sans-serif;
 107 }
 108
 109 KBD {
 110   color: #006600;
 111   font-family: monaco, courier, monospace;
 112   font-weight: bold;
 113 }
 114
 115 PRE {
 116   font-family: monaco, courier, monospace;
 117 }
 118
 119 PRE.command {
 120   background: #f0f0f0;
 121   border: dotted thin #7f7f7f;
 122   color: #7f0000;
 123   margin-left: 36pt;
 124   padding: 10px;
 125 }
 126
 127 P.example {
 128   font-style: italic;
 129   margin-left: 36pt;
 130 }
 131
 132 PRE.example {
 133   background: white;
 134   border: dotted thin #999999;
 135   margin-left: 36pt;
 136   padding: 10px;
 137 }
 138
 139 PRE.command EM, PRE.example EM {
 140   color: #3f0000;
 141   font-family: lucida grande, geneva, helvetica, arial, sans-serif;
 142 }
 143
 144 P.command {
 145   color: #7f0000;
 146   font-family: monaco, courier, monospace;
 147   margin-left: 36pt;
 148 }
 149
 150 P.formula {
 151   font-style: italic;
 152   margin-left: 36pt;
 153 }
 154
 155 BLOCKQUOTE {
 156   background: #f0f0f0;
 157   border: inset 1px #eeeeee;
 158   padding: 10px;
 159   /* These are not implemented by all browsers, but that's OK */
 160   border-radius: 5px;
 161   -moz-border-radius: 5px;
 162 }
 163
 164 A IMG {
 165   border: none;
 166 }
 167
 168 A:link:hover IMG {
 169   background: #f0f0f0;
 170   border-radius: 10px;
 171   -moz-border-radius: 10px;
 172 }
 173
 174 A:link, A:visited {
 175   font-weight: inherit;
 176   text-decoration: none;
 177   color: #000099;
 178 }
 179
 180 A:link:hover, A:visited:hover, A:active {
 181   text-decoration: underline;
 182   color: #990099;
 183 }
 184
 185 TABLE.page {
 186   border: none;
 187   border-collapse: collapse;
 188   height: 100%;
 189   margin: 0;
 190   padding: 0;
 191   width: 100%;
 192 }
 193
 194 TD.body {
 195   height: 100%;
 196   vertical-align: top;
 197 }
 198
 199 TD.sel, TD.unsel {
 200   border-left: thin solid #cccccc;
 201   padding: 0px 5px;
 202   text-align: center;
 203   vertical-align: middle;
 204   width: 14%;
 205 }
 206
 207 TD.sel {
 208   background: url(images/sel.gif);
 209 }
 210
 211 TD.unsel {
 212   background: url(images/unsel.gif);
 213 }
 214
 215 TD.sel A, TD.sel A:hover, TD.unsel A:link:hover, TD.unsel A:visited:hover,
 216 TD.unsel A:active, TD.unsel A, TD.unsel A:visited {
 217   color: #666666;
 218   display: block;
 219   font-weight: normal;
 220   padding: 8px;
 221   text-decoration: none;
 222 }
 223
 224 TD.trailer {
 225   background: #f0f0f0;
 226   border: solid thin #e0e0e0;
 227   color: #666666;
 228   font-size: 80%;
 229   padding: 5px;
 230 }
 231
 232 TD.trailer A {
 233   color: #666699;
 234 }
 235
 236 FORM {
 237   display: inline;
 238 }
 239
 240 INPUT[TYPE="TEXT"], TEXTAREA {
 241   font-family: monaco, courier, monospace;
 242 }
 243
 244 INPUT[TYPE="IMAGE"] {
 245   border: none;
 246   padding: 2pt;
 247   vertical-align: bottom;
 248 }
 249
 250 SUB, SUP {
 251   font-size: 50%;
 252 }
 253
 254 TR.data, TD.data, TR.data TD {
 255   margin-top: 10pt;
 256   padding: 5pt;
 257   border-bottom: solid 1pt #999999;
 258 }
 259
 260 TR.data TH {
 261   border-bottom: solid 1pt #999999;
 262   padding-top: 10pt;
 263   padding-left: 5pt;
 264   text-align: left;
 265 }
 266
 267 DIV.table TABLE {
 268   border: solid thin #999999;
 269   border-collapse: collapse;
 270   border-spacing: 0;
 271   margin-left: auto;
 272   margin-right: auto;
 273 }
 274
 275 DIV.table CAPTION {
 276   caption-side: top;
 277   font-size: 120%;
 278   font-style: italic;
 279   font-weight: bold;
 280   margin-left: auto;
 281   margin-right: auto;
 282 }
 283
 284 DIV.table TABLE TD {
 285   background: white;
 286   border: solid thin #bbbbbb;
 287   padding-top: 5pt;
 288 }
 289
 290 DIV.table TABLE TH {
 291   background: #f0f0f0;
 292   border: none;
 293   border-bottom: solid thin #999999;
 294 }
 295
 296 DIV.figure TABLE {
 297   margin-left: auto;
 298   margin-right: auto;
 299 }
 300
 301 DIV.figure CAPTION {
 302   caption-side: bottom;
 303   font-size: 120%;
 304   font-style: italic;
 305   font-weight: bold;
 306   margin-left: auto;
 307   margin-right: auto;
 308 }
 309
 310 TH.label {
 311   text-align: right;
 312   vertical-align: top;
 313 }
 314
 315 TH.sublabel {
 316   text-align: right;
 317   font-weight: normal;
 318 }
 319
 320 HR {
 321   border: solid thin;
 322 }
 323
 324 SPAN.info {
 325   background: black;
 326   border: thin solid black;
 327   color: white;
 328   font-size: 80%;
 329   font-style: italic;
 330   font-weight: bold;
 331   white-space: nowrap;
 332 }
 333
 334 H2 SPAN.info, H3 SPAN.info, H4 SPAN.info {
 335   float: right;
 336   font-size: 100%;
 337 }
 338
 339 .conflict {
 340   background: red;
 341   color: white;
 342 }
 343
 344 TH.conflict {
 345   text-align: right;
 346 }
 347
 348 H1.title {
 349   display: none;
 350 }
 351
 352 H2.title, H3.title {
 353   border-bottom: solid 1pt #999999;
 354 }
 355
 356 TABLE.indent {
 357   margin-top: 2em;
 358   margin-left: auto;
 359   margin-right: auto;
 360   width: 90%;
 361 }
 362
 363 TABLE.indent {
 364   border-collapse: collapse;
 365 }
 366
 367 TABLE.indent TD, TABLE.indent TH {
 368   padding: 0;
 369 }
 370
 371 TABLE.list {
 372   border-collapse: collapse;
 373   margin-left: auto;
 374   margin-right: auto;
 375   width: 90%;
 376 }
 377
 378 TABLE.list TH {
 379   background: white;
 380   border-bottom: solid thin #cccccc;
 381   color: #444444;
 382   padding-top: 10pt;
 383   padding-left: 5pt;
 384   text-align: left;
 385   vertical-align: bottom;
 386   white-space: nowrap;
 387 }
 388
 389 TABLE.list TH A {
 390   color: #4444cc;
 391 }
 392
 393 TABLE.list TD {
 394   border-bottom: solid thin #eeeeee;
 395   padding-top: 5pt;
 396   padding-left: 5pt;
 397 }
 398
 399 TABLE.list TR:nth-child(even) {
 400   background: #f8f8f8;
 401 }
 402
 403 TABLE.list TR:nth-child(odd) {
 404   background: #f4f4f4;
 405 }
 406
 407 DIV.sidebar {
 408   float: right;
 409   min-width: 25%;
 410   margin-left: 10px;
 411   max-width: 33%;
 412 }
 413
 414 DIV.sidebar P.l0 {
 415   margin-bottom: 0;
 416   margin-left: 0;
 417   margin-right: 0;
 418   margin-top: 12pt;
 419 }
 420
 421 DIV.sidebar P.l1 {
 422   margin-bottom: 0;
 423   margin-left: 36pt;
 424   margin-right: 0;
 425   margin-top: 0;
 426   text-indent: -18pt;
 427 }
 428
 429 DIV.sidebar P.l2 {
 430   font-style: italic;
 431   margin-bottom: 0;
 432   margin-left: 54pt;
 433   margin-right: 0;
 434   margin-top: 0;
 435   text-indent: -18pt;
 436 }
 437
 438 TABLE.inset {
 439   background: #f0f0f0;
 440   border: thin solid #e0e0e0;
 441   margin-top: 1em;
 442   padding: 0;
 443   width: 100%;
 444   /* These are not implemented by all browsers, but that's OK */
 445   border-radius: 5px;
 446   -moz-border-radius: 5px;
 447 }
 448
 449 TABLE.inset CAPTION {
 450   caption-side: top;
 451   color: #666666;
 452   font-size: 80%;
 453   margin-left: 10px;
 454   margin-bottom: 2px;
 455   text-align: left;
 456 }
 457
 458 TABLE.inset TD {
 459   padding: 2px;
 460 }
 461
 462 DT {
 463   margin-left: 36pt;
 464   margin-top: 12pt;
 465 }
 466
 467 DD {
 468   margin-left: 54pt;
 469 }
 470
 471 DL.category DT {
 472   font-weight: bold;
 473 }
 474
 475 P.summary {
 476   margin-left: 36pt;
 477   font-family: monaco, courier, monospace;
 478 }
 479
 480 DIV.summary TABLE {
 481   border: solid thin #999999;
 482   border-collapse: collapse;
 483   border-spacing: 0;
 484   margin: 10px;
 485 }
 486
 487 DIV.summary TABLE TD, DIV.summary TABLE TH {
 488   background: white;
 489   border: solid thin #999999;
 490   border-spacing: 0;
 491   padding: 5px;
 492   text-align: left;
 493   vertical-align: top;
 494 }
 495
 496 DIV.summary TABLE THEAD TH {
 497   background: #f0f0f0;
 498 }
 499
 500 DIV.tabs {
 501   height: 480px;
 502   overflow: hidden;
 503 }
 504
 505 DIV.tab {
 506   float: left;
 507   height: 100%;
 508   overflow-y: auto;
 509   width: 100%;
 510 }
 511
 512 /* API documentation styles... */
 513 div.body h1 {
 514   margin: 0;
 515 }
 516 div.body h2 {
 517   margin-top: 1.5em;
 518 }
 519 div.body h3, div.body h4, div.body h5 {
 520   margin-bottom: 0.5em;
 521   margin-top: 1.5em;
 522 }
 523 .class, .enumeration, .function, .struct, .typedef, .union {
 524   border-bottom: solid thin #999999;
 525   margin-bottom: 0;
 526   margin-top: 2em;
 527 }
 528 .description {
 529   margin-top: 0.5em;
 530 }
 531 code, p.code, pre, ul.code li {
 532   font-family: monaco, courier, monospace;
 533   font-size: 90%;
 534 }
 535 ul.code, ul.contents, ul.subcontents {
 536   list-style-type: none;
 537   margin: 0;
 538   padding-left: 0;
 539 }
 540 ul.code li {
 541   margin: 0;
 542 }
 543 ul.contents > li {
 544   margin-top: 1em;
 545 }
 546 ul.contents li ul.code, ul.contents li ul.subcontents {
 547   padding-left: 2em;
 548 }
 549 div.body dl {
 550   margin-left: 0;
 551   margin-top: 0;
 552 }
 553 div.body dt {
 554   font-style: italic;
 555   margin-left: 0;
 556   margin-top: 0;
 557 }
 558 div.body dd {
 559   margin-bottom: 0.5em;
 560 }
 561 /* iPhone/iPod touch overrides */
 562 @media only screen and (min-device-width: 320px) and (max-device-width: 480px),
 563        only screen and (min-device-width: 320px) and (max-device-width: 568px) {
 564   .mobile {
 565     display: inherit;
 566   }
 567   .no-mobile {
 568     display: none;
 569   }
 570
 571   .footer {
 572     font-size: 10px;
 573     height: auto;
 574     position: relative;
 575   }
 576
 577   .row .thirds, .row .halves {
 578     float: none;
 579     margin: 0;
 580     width: 100%;
 581   }
 582
 583   DIV.sidebar {
 584     float: none;
 585     margin-left: 0;
 586     max-width: 100%;
 587     min-width: 100%;
 588     width: 100%;
 589   }
 590
 591   BLOCKQUOTE {
 592     margin: 0;
 593   }
 594
 595   P.example {
 596     margin-left: 0;
 597   }
 598
 599   PRE.command, PRE.example {
 600     margin-left: 0;
 601     white-space: pre-wrap;
 602   }
 603 }
 604
 605 /* iPad overrides */
 606 @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
 607
 608   .mobile {
 609     display: inherit;
 610   }
 611   .no-mobile {
 612     display: none;
 613   }
 614 }