Documentation/css/lilypond-manuals.css

   1 /**********************************************************/
   2 /*                  GENERAL INFORMATION                   */
   3 /**********************************************************/
   4
   5 /* Each web manual is styled using a different color. Each
   6    one has been assigned a hue value on the HSB color chart.
   7    All specific colors for a manual are shades and tints
   8    of that hue.
   9
  10    The brown of the usage manual does not follow this scheme.
  11    Neither does the 'default' olive green of the glossary,
  12    essay, snippets, and changes manuals.
  13
  14    Manual            Color          Hue
  15    learning          green          120
  16    music-glossary
  17    essay
  18
  19    notation          blue           205
  20    usage             brown
  21    snippets
  22
  23    changes
  24    extending         red            0
  25    internals         purple         280
  26
  27    contributor       black          doesn't matter - desat
  28
  29 /**********************************************************/
  30 /*                  PAGE-WIDE SETTINGS                    */
  31 /**********************************************************/
  32
  33 html {
  34   height: 100%;
  35 }
  36
  37 body {
  38   margin: 0 auto;
  39   padding: 0;
  40   height: 100%;
  41   font-size: 100%;
  42   line-height: 1.125;
  43   color: #222;
  44   background-color: #fff;
  45 }
  46
  47 /***********************************************************/
  48 /*                      HEADERS                            */
  49 /***********************************************************/
  50
  51 .chapter, .section, .subsection, .subsubsection,
  52 .appendix, .appendixsec, .appendixsubsec,
  53 .unnumbered, .unnumberedsec, .unnumberedsubsec, .unnumberedsubsubsec,
  54 .subheading, .subsubheading {
  55   color: rgb(32, 74, 135);
  56   padding-bottom: 0.15em;
  57   margin-top: 0.6em;
  58   margin-bottom: 0.6em;
  59 }
  60
  61 .settitle {
  62   font-size: 2em;
  63   text-align: center;
  64   padding: 0.8em 0.5em;
  65   margin: 0;
  66 }
  67
  68 .chapter, .appendix, .unnumbered,
  69 .section, .appendixsec, .unnumberedsec,
  70 .subsection, .appendixsubsec, .unnumberedsubsec,
  71 .subsubsection {
  72   font-size: 1.7em;
  73   margin-top: 0.9em;
  74 }
  75
  76 .subheading, .unnumberedsubsubsec {
  77   font-size: 1.5em;
  78   margin-top: 0.9em;
  79 }
  80
  81 .subheading {
  82   border-top: 1px solid rgb(200, 200, 200);
  83   padding-top: 0.8em;
  84 }
  85
  86 .subsubheading {
  87   font-size: 1.15em;
  88   font-weight: bold;
  89   margin-top: 1.6em;
  90 }
  91
  92 .chapheading {
  93   position: absolute;
  94   height: 0;
  95   overflow: hidden;
  96   text-indent: -999em;
  97 }
  98
  99 /***********************************************************/
 100 /*                       LINKS                             */
 101 /***********************************************************/
 102
 103 a:link {
 104   color: #0c51ab;
 105 }
 106
 107 a:visited {
 108   color: #804f01;
 109 }
 110
 111 a:active {
 112   color: #278800;
 113 }
 114
 115 a:hover {
 116   color: #0105ad;
 117 }
 118
 119 /***********************************************************/
 120 /*                  BLOCK FORMATTING                       */
 121 /***********************************************************/
 122
 123 blockquote,
 124 .smallexample {
 125   width: 96%;
 126   padding: 0;
 127   border: solid #d5d7d6;
 128   border-width: 1px 1px 1px 3px;
 129   border-radius: 5px;
 130   margin: 1em auto;
 131   background-color: white;
 132 }
 133
 134 blockquote p, pre.smallexample {
 135   padding: 1em;
 136   margin: 0;
 137 }
 138
 139 blockquote blockquote {
 140   border: none;
 141 }
 142
 143 .verbatim, .example, .lisp {
 144   font-size: 1em;
 145   padding: 1em;
 146   margin: 0;
 147 }
 148
 149 #main hr {
 150   height: 0;
 151   padding: 0;
 152   border: 0;
 153   margin: 0;
 154   text-indent: -999em;
 155 }
 156
 157 table.cartouche {
 158   background: #eef;
 159   width: 85%;
 160   border-collapse: collapse;
 161   padding: 0 0.5em;
 162   border: 1px solid #c8c8c8;
 163   margin: 0 auto 1em;
 164 }
 165
 166 table.cartouche p {
 167   padding: 1em;
 168   margin: 0;
 169 }
 170
 171 table.cartouche td {
 172   border: none;
 173 }
 174
 175 /***********************************************************/
 176 /*                    MAIN CONTENT                         */
 177 /***********************************************************/
 178
 179 div#main {
 180   position: absolute;
 181   top: 0;
 182   right: 0;
 183   bottom: 0;
 184   left: 27%;
 185   padding: 0;
 186   margin: 0;
 187   overflow: auto;
 188 }
 189
 190 div#main li {
 191   padding: 0 1em 0.5em 0;
 192 }
 193
 194 div#main ul {
 195   margin: 0;
 196   padding-left: 3em;
 197 }
 198
 199 h1, h2, h3, h4, p, table, address, dt {
 200   padding-left: 18px;
 201   padding-right: 18px;
 202 }
 203
 204 p {
 205   margin: 1em 0;
 206 }
 207
 208 #languages {
 209   font-size: 0.8em;
 210   padding: 0.9em 18px;
 211   margin: 0;
 212 }
 213
 214 pre.menu-comment {
 215   font-size: 1em;
 216   padding-top: 1em;
 217   padding-bottom: 0;
 218   margin: 0;
 219 }
 220
 221 #main .contents li {
 222   padding-bottom: 0;
 223 }
 224
 225 #main .contents > ul {
 226   margin-bottom: 1em;
 227 }
 228
 229 table th {
 230   text-align: left;
 231 }
 232
 233 table td {
 234     vertical-align: top;
 235     padding-bottom: .5em;
 236 }
 237
 238 /***********************************************************/
 239 /*                    TOC SIDEBAR                          */
 240 /***********************************************************/
 241
 242 div#tocframe {
 243   position: absolute;
 244   top: 0;
 245   right: 73%;
 246   bottom: 0;
 247   left: 0;
 248   padding: 0;
 249   margin: 0;
 250   overflow: auto;
 251   background: #657f40;
 252   z-index: 100;
 253   list-style-type: none;
 254   font-size: 0.83em;
 255   line-height: 1.3;
 256 }
 257
 258 body.learning    #tocframe { background-color: #407f40; }
 259 body.notation    #tocframe { background-color: #40657f; }
 260 body.usage       #tocframe { background-color: #7d765a; }
 261 body.extending   #tocframe { background-color: #7f4040; }
 262 body.internals   #tocframe { background-color: #6a407f; }
 263 body.contributor #tocframe { background-color: #333333; }
 264
 265 @media screen {
 266   body > div#tocframe {
 267     position: fixed
 268   }
 269 }
 270
 271 div#tocframe a:link,
 272 div#tocframe a:visited {
 273   color: #eee;
 274   text-decoration: none;
 275 }
 276
 277 div#tocframe a:hover {
 278   color: #fff;
 279   text-decoration: underline;
 280 }
 281
 282 div#tocframe p.toc_uplink {
 283   font-size: 1em;
 284   line-height: 1.125;
 285   padding: 0.25em 1em 0.25em 0.5em;
 286   margin: 0;
 287 }
 288
 289 div#tocframe h4 {
 290   font-size: 1em;
 291   line-height: 1.125;
 292   font-weight: bold;
 293   font-style: italic;
 294   padding: 0.75em 0.5em 0 0.5em;
 295   margin: 0;
 296 }
 297
 298 #tocframe .contents {
 299   background-color: transparent;
 300   list-style-type: none;
 301   padding: 0;
 302   border: 0;
 303   margin: 0;
 304 }
 305
 306 #tocframe ul.toc {
 307   padding: 0.25em 0.5em 1em 0.5em;
 308   list-style-type: none;
 309   margin: 0;
 310 }
 311
 312 #tocframe ul.toc ul.toc {
 313   padding: 0;
 314   margin: 0;
 315 }
 316
 317 #tocframe ul.toc li {
 318   padding: 0;
 319   margin: 0;
 320 }
 321
 322 #tocframe ul.toc > li {
 323   font-size: 1em;
 324 }
 325
 326 #tocframe ul.toc li li {
 327   padding-left: 1em;
 328 }
 329
 330 li.toc_current {
 331   font-weight: bold;
 332   font-style: italic;
 333 }
 334
 335 li.toc_current ul {
 336   font-weight: normal;
 337   font-style: normal;
 338   background: transparent;
 339 }
 340
 341 /***********************************************************/
 342 /*                     NAVIGATION                          */
 343 /***********************************************************/
 344
 345 .nav_table {
 346   width: 100%;
 347   background-color: #d5d7d6;
 348   color: #505050;
 349   font-size: 0.83em;
 350   border-collapse: separate;
 351   padding: 5px 18px;
 352   border: none;
 353   margin: 0;
 354 }
 355
 356 .nav_table a:link,
 357 .nav_table a:visited {
 358   color: #505050;
 359   text-decoration: none;
 360 }
 361
 362 .nav_table a:hover {
 363   color: #000;
 364   text-decoration: underline;
 365 }
 366
 367 .nav_table tr,
 368 .nav_table a {
 369   padding: 0;
 370   margin: 0;
 371 }
 372
 373 .nav_table td {
 374   padding: 0.1em 0px;
 375   margin: 0;
 376 }
 377
 378 div.header {
 379   background: #b1d281;
 380   text-align: center;
 381   padding: 0.5em;
 382   border-bottom: 1px solid #7b925a;
 383   margin: 0;
 384   height: auto;
 385 }
 386
 387 div.header h1 {
 388   font-size: 2em;
 389   padding: 0.25em;
 390   margin: 0;
 391 }
 392
 393 div.subheader {
 394   background: #ddd;
 395   padding: 0;
 396   margin: 0;
 397   text-align: center;
 398 }
 399
 400 div.subheader p {
 401   padding: 0.5em;
 402   margin: 0;
 403 }
 404
 405 table#navigation {
 406   line-height: 1.5;
 407   padding: 0;
 408   margin: 1em auto;
 409 }
 410
 411 table#navigation td {
 412   padding: 0.5em 0.75em;
 413 }
 414
 415 table#navigation ul {
 416   padding-left: 0.5em;
 417   margin: 0;
 418 }
 419
 420 table .title {
 421   font-weight: bold;
 422 }
 423
 424 .footer {
 425   font-size: 0.8em;
 426   padding: 0.2em 0;
 427   margin: 0;
 428 }
 429
 430 .footer p {
 431   padding: 0 18px;
 432   margin: 0.4em 0;
 433 }
 434
 435 table.menu {
 436   margin: 0 0 1em;
 437 }
 438
 439 /***********************************************************/
 440 /*               OVERRIDES FOR PRINTING                    */
 441 /***********************************************************/
 442
 443 @media print {
 444   /* Hide the sidebar and make the main contents take up the full width */
 445   div#main { position: static; overflow: visible; left: 0; }
 446   div#tocframe { display: none; }
 447   /* Also don't show the navigation toolbars between all sections */
 448   .nav_table { display: none; }
 449 }
 450
 451 /***********************************************************/
 452 /*           FORMATTING of AJAX SEARCH BOX                 */
 453 /***********************************************************/
 454
 455 div#search {
 456   border: none;
 457   border-bottom: 1pt solid #C5972C;
 458   background: #E8E3AC;
 459   padding-left: 3px;
 460   padding-top: 2px;
 461   padding-bottom: 1px;
 462 }
 463 div#search p, div#search form {
 464   padding: 0;
 465   margin: 0;
 466 }
 467 #search_results {
 468   font-size: 0.75em;
 469   padding: 0;
 470   margin: 0;
 471   display: none;
 472 }
 473 #search_results table {
 474   width: 100%;
 475 }
 476
 477 /***********************************************************/
 478 /*               OTHER                                     */
 479 /***********************************************************/
 480
 481 .warning {
 482   background: #eef;
 483   text-align: left;
 484   padding: 0;
 485   border: 1px solid #c8c8c8;
 486   border-radius: 5px;
 487   margin: 1em;
 488 }
 489
 490 .advanced {
 491   background: #ffffc8;
 492   text-align: left;
 493   padding: 0;
 494   border: 1px solid #c8c8c8;
 495   border-radius: 5px;
 496   margin: 0.5em 0.5em 2em 3em;
 497 }