+/**********************************************************/
+/* GENERAL INFORMATION */
+/**********************************************************/
+
+/* Each web manual is styled using a different color. Each
+ one has been assigned a hue value on the HSB color chart.
+ All specific colors for a manual are shades and tints
+ of that hue.
+
+ The brown of the usage manual does not follow this scheme.
+ Neither does the 'default' olive green of the glossary,
+ essay, snippets, and changes manuals.
+
+ Manual Color Hue
+ learning green 120
+ music-glossary
+ essay
+
+ notation blue 205
+ usage brown
+ snippets
+
+ changes
+ extending red 0
+ internals purple 280
+
+ contributor black doesn't matter - desat
+
/**********************************************************/
/* PAGE-WIDE SETTINGS */
/**********************************************************/
height: 100%;
font-size: 100%;
line-height: 1.125;
- color: #000;
+ color: #222;
background-color: #fff;
}
.appendix, .appendixsec, .appendixsubsec,
.unnumbered, .unnumberedsec, .unnumberedsubsec, .unnumberedsubsubsec,
.subheading, .subsubheading {
- color: #204a87;
- border-bottom: 1px dashed black;
+ color: rgb(32, 74, 135);
padding-bottom: 0.15em;
margin-top: 0.6em;
- margin-bottom: 1em;
+ margin-bottom: 0.6em;
}
.settitle {
- background: #b1d281;
font-size: 2em;
text-align: center;
- padding: 0.4em 0.5em;
- border: solid #7b925a;
- border-width: 1px 0;
+ padding: 0.8em 0.5em;
margin: 0;
}
-.chapter, .appendix, .unnumbered {
- font-size: 1.8em;
-}
-
-.section, .appendixsec, .unnumberedsec {
- font-size: 1.6em;
+.chapter, .appendix, .unnumbered,
+.section, .appendixsec, .unnumberedsec,
+.subsection, .appendixsubsec, .unnumberedsubsec,
+.subsubsection {
+ font-size: 1.7em;
+ margin-top: 0.9em;
}
-.subsection, .appendixsubsec, .unnumberedsubsec {
- font-size: 1.4em;
+.subheading, .unnumberedsubsubsec {
+ font-size: 1.5em;
+ margin-top: 0.9em;
}
-.subheading, .subsubsection, .unnumberedsubsubsec {
- font-size: 1.25em;
+.subheading {
+ border-top: 1px solid rgb(200, 200, 200);
+ padding-top: 0.8em;
}
.subsubheading {
- font-size: 1em;
+ font-size: 1.15em;
font-weight: bold;
+ margin-top: 1.6em;
}
.chapheading {
/* BLOCK FORMATTING */
/***********************************************************/
-blockquote, .smallexample {
+blockquote,
+.smallexample {
width: 96%;
padding: 0;
- border: solid #b1d281;
- border-width: 1px 1px 1px 5px;
+ border: solid #d5d7d6;
+ border-width: 1px 1px 1px 3px;
+ border-radius: 5px;
margin: 1em auto;
+ background-color: white;
}
blockquote p, pre.smallexample {
}
table.cartouche {
- background: #f5f5dc;
+ background: #eef;
width: 85%;
border-collapse: collapse;
padding: 0 0.5em;
- border: 2px solid #8f5902;
+ border: 1px solid #c8c8c8;
margin: 0 auto 1em;
}
}
h1, h2, h3, h4, p, table, address, dt {
- padding-left: 1em;
- padding-right: 1em;
+ padding-left: 18px;
+ padding-right: 18px;
}
p {
}
#languages {
- padding: 0.5em 1em;
+ font-size: 0.8em;
+ padding: 0.9em 18px;
margin: 0;
}
margin-bottom: 1em;
}
+table th {
+ text-align: left;
+}
+
+table td {
+ vertical-align: top;
+ padding-bottom: .5em;
+}
+
/***********************************************************/
/* TOC SIDEBAR */
/***********************************************************/
padding: 0;
margin: 0;
overflow: auto;
- background: #f5f5dc;
+ background: #657f40;
z-index: 100;
list-style-type: none;
font-size: 0.83em;
line-height: 1.3;
}
+body.learning #tocframe { background-color: #407f40; }
+body.notation #tocframe { background-color: #40657f; }
+body.usage #tocframe { background-color: #81613e; }
+body.extending #tocframe { background-color: #7f4040; }
+body.internals #tocframe { background-color: #6a407f; }
+body.contributor #tocframe { background-color: #333333; }
+
@media screen {
body > div#tocframe {
position: fixed
}
}
-div#tocframe a:link, div#tocframe a:visited {
- color: #454532;
+div#tocframe a:link,
+div#tocframe a:visited {
+ color: #eee;
text-decoration: none;
}
div#tocframe a:hover {
- color: #232b16;
+ color: #fff;
text-decoration: underline;
}
div#tocframe p.toc_uplink {
font-size: 1em;
line-height: 1.125;
- background: #c9ccc4;
padding: 0.25em 1em 0.25em 0.5em;
- border-bottom: 1px solid #a0a087;
margin: 0;
}
-div#tocframe p.toc_uplink a:link,
-div#tocframe p.toc_uplink a:visited {
- color: #1c1c1b;
-}
-
-div#tocframe p.toc_uplink a:hover {
- color: #000;
-}
-
div#tocframe h4 {
font-size: 1em;
line-height: 1.125;
font-size: 1em;
}
+#tocframe .contents > ul.toc > li {
+ margin-top: 0.5em;
+}
+
#tocframe ul.toc li li {
padding-left: 1em;
}
.nav_table {
width: 100%;
- background: #c9ccc4;
+ background-color: #d5d7d6;
+ color: #505050;
font-size: 0.83em;
- border-collapse: collapse;
- padding: 0;
+ border-collapse: separate;
+ padding: 5px 18px;
border: none;
margin: 0;
}
-.nav_table a:link, .nav_table a:visited {
- color: #1c1c1b;
+.nav_table a:link,
+.nav_table a:visited {
+ color: #505050;
text-decoration: none;
}
text-decoration: underline;
}
-.nav_table tr, .nav_table a {
+.nav_table tr,
+.nav_table a {
padding: 0;
margin: 0;
}
.nav_table td {
- padding: 0.25em;
+ padding: 0.1em 0px;
margin: 0;
}
}
.footer {
- background: #e5f5ce;
font-size: 0.8em;
padding: 0.2em 0;
- border: solid #b1d281;
- border-width: 0 0 5px 0;
margin: 0;
}
-.footer a:link {
- color: #0308fc;
-}
-
.footer p {
- padding: 0 1.25em;
+ padding: 0 18px;
margin: 0.4em 0;
}
background: #eef;
text-align: left;
padding: 0;
- border: 1px solid green;
- /* Experimental rounded corners */
- -moz-border-radius: 10px;
- -webkit-border-radius: 10px;
+ border: 1px solid #c8c8c8;
+ border-radius: 5px;
margin: 1em;
}
.advanced {
- background: #eeffcc;
+ background: #ffffc8;
text-align: left;
padding: 0;
- border: 1px solid green;
- /* Experimental rounded corners */
- -moz-border-radius: 10px;
- -webkit-border-radius: 10px;
+ border: 1px solid #c8c8c8;
+ border-radius: 5px;
margin: 0.5em 0.5em 2em 3em;
}
+
+/***********************************************************/
+/* RESPONSIVE DESIGN */
+/***********************************************************/
+
+@media (min-width: 1280px) {
+ div#main {
+ left: 346px
+ }
+ div#tocframe {
+ width: 346px;
+ right: 0;
+ }
+}