X-Git-Url: https://git.donarmstrong.com/?a=blobdiff_plain;f=Documentation%2Fcss%2Flilypond-web.css;h=25d90befd13f8fba15e74287f445889f574f8d50;hb=fc5ab26e3d13884e92981243219bd04d3fb921fa;hp=3b3994905fee6490879ebc4c98d8fe121d65cf0c;hpb=b0e58f4a55426db0c5152b6bd008da186941c511;p=lilypond.git diff --git a/Documentation/css/lilypond-web.css b/Documentation/css/lilypond-web.css index 3b3994905f..25d90befd1 100644 --- a/Documentation/css/lilypond-web.css +++ b/Documentation/css/lilypond-web.css @@ -8,9 +8,9 @@ html { body { position: absolute; top: 0; - left: 1%; - right: 1%; - width: 98%; + left: 0.5%; + right: 0.5%; + width: 99%; min-width: 42em; max-width: 70em; font-size: 95%; @@ -41,15 +41,33 @@ a img { border: 0; } -/* Table of Contents */ +/* Hyperlinks */ + +/* no dotted line around clicked tabs */ +a:focus { + outline-style: none; +} + +a:link { + color: #0c51ab; +} + +a:visited { + color: #804f01; +} + +a:hover { + color: #0105ad; +} +/* Table of Contents */ /* first level toc (unnumbered) */ div#tocframe { position: absolute; top: 0; left: 0; right: 0; - background: #9ccc7c; + background: #6aec7c url(../pictures/nav-bg.png) repeat-x top left; max-width: 70em; font-size: 100%; line-height: 1; @@ -62,7 +80,8 @@ div#tocframe { } #tocframe a { - color: #000; + color: #fff; + text-decoration: none; } #tocframe ul.toc { @@ -73,7 +92,7 @@ div#tocframe { #tocframe > ul:first-child > li:first-child a { text-indent: -999em; - background: #9ccc7c url(../pictures/lily-home.png) no-repeat 50% 50%; + background: #6aec7c url(../pictures/lily-home-nav-bg.png) no-repeat 50% 50%; width: 9%; /* css3 no go yet? */ border-bottom-left-radius: 30px; @@ -82,19 +101,19 @@ div#tocframe { } #tocframe > ul:first-child > li:first-child a:hover { - background: #bdee9d url(../pictures/lily-home.png) no-repeat 50% 50%; + background: #6aec7c url(../pictures/lily-home-nav-hover.png) no-repeat 50% 50%; width: 9%; } #tocframe > ul:first-child > li:first-child.toc_current a { text-indent: -999em; - background: #8cbc6c url(../pictures/lily-home.png) no-repeat 50% 50%; + background: url(../pictures/lily-home-nav-active.png) no-repeat 50% 50%; width: 9%; } #tocframe > ul:first-child > li:first-child.toc_current a:hover { text-indent: -999em; - background: #acdd8c url(../pictures/lily-home.png) no-repeat 50% 50%; + background: url(../pictures/lily-home-nav-active.png) no-repeat 50% 50%; width: 9%; } @@ -114,9 +133,9 @@ div#tocframe { #tocframe li form { float: left; width: 17%; - background: #9ccc7c; + background: #6aec7c url(../pictures/nav-bg.png); font-size: 100%; - padding: 0.5em 0.8%; + padding: 0.45em 0.8%; margin: 0; } @@ -134,34 +153,42 @@ div#tocframe { -webkit-border-bottom-right-radius: 20px; } +#tocframe li form input[type="hidden"] { + position: relative; + height: 0; + overflow: hidden; + text-indent: -999em; + padding: 0; + margin: 0; +} + #tocframe li a { + background: #6aec7c url(../pictures/nav-bg.png); float: left; width: 18%; text-align: center; font-weight: bold; - padding: 0.85em 0; + padding: 0.68em 0; margin: 0; - background: #9ccc7c; } #tocframe li a:hover { - background: #bdee9d; - text-decoration: none; + background: url(../pictures/nav-hover.png); } #tocframe li.toc_current a, #tocframe li.toc_current a:hover { - background: #8cbc6c; - text-decoration: none; + background: url(../pictures/nav-active.png); + color: #fff; + text-decoration: underline; } /* second level toc (unnumberedsec) */ - #tocframe .toc .toc { position: absolute; top: 3.8em; - left: 1%; - right: 1%; + left: 0.5%; + right: 0.5%; font-size: 82%; padding: 0; margin: 0; @@ -192,6 +219,7 @@ div#tocframe { width: auto; background: #ceffae; line-height: 2; + color: #000; text-decoration: none; text-indent: 0; font-weight: normal; @@ -199,94 +227,87 @@ div#tocframe { margin: 0; } - -#tocframe .toc .toc li.toc_current a { - background: #8cbc6c; -} - -#tocframe .toc .toc li.toc_current a:hover { - background: #acdd8c; -} - #tocframe .toc .toc li a:hover { background: #bdee9d; } /* colored second-level TOC items */ #tocframe .toc .toc li.color1 a { - text-decoration: none; - background: #9ccc7c; + background: #9ccc7c url(../pictures/color1-bg.png) repeat-x top left; } #tocframe .toc .toc li.color2 a { - text-decoration: none; - background: #bbcf81; + background: #bbcf81 url(../pictures/color2-bg.png) repeat-x top left; } #tocframe .toc .toc li.color3 a { - text-decoration: none; - background: #dbd286; + background: #dbd286 url(../pictures/color3-bg.png) repeat-x top left; } #tocframe .toc .toc li.color4 a { - text-decoration: none; - background: #fad58c; + background: #fad58c url(../pictures/color4-bg.png) repeat-x top left; } -/* having this useless style makes the perl init file easier */ #tocframe .toc .toc li.colorDefault a { + background: #8cbc6c url(../pictures/nav-bg-2.png) repeat-x top left; + color: #fff; +} + +#tocframe .toc .toc li.colorDefault a:hover { + background: #8cbc6c url(../pictures/nav-hover-2.png) repeat-x top left; + color: #fff; } #tocframe .toc .toc li.color1 a:hover { - background: #addd8d; + background: #addd8d url(../pictures/color1-hover.png) repeat-x top left; } #tocframe .toc .toc li.color2 a:hover { - background: #ccdf92; + background: #ccdf92 url(../pictures/color2-hover.png) repeat-x top left; } #tocframe .toc .toc li.color3 a:hover { - background: #ece297; + background: #ece297 url(../pictures/color3-hover.png) repeat-x top left; } #tocframe .toc .toc li.color4 a:hover { - background: #fbe69d; + background: #fbe69d url(../pictures/color4-hover.png) repeat-x top left; } -#tocframe .toc .toc li.color1.toc_current a { - background: #beee9e; +#tocframe .toc .toc li.toc_current a, +#tocframe .toc .toc li.toc_current a:hover { + color: #000; + text-decoration: underline; } -#tocframe .toc .toc li.color1.toc_current a:hover { - background: #beee9e; +#tocframe .toc .toc li.colorDefault.toc_current a, +#tocframe .toc .toc li.colorDefault.toc_current a:hover { + background: #8cbc6c url(../pictures/nav-active-2.png) repeat-x top left; + color: #fff; + text-decoration: underline; } -#tocframe .toc .toc li.color2.toc_current a { - background: #ddefa3; +#tocframe .toc .toc li.color1.toc_current a, +#tocframe .toc .toc li.color1.toc_current a:hover { + background: #beee9e url(../pictures/color1-active.png) repeat-x top left; } +#tocframe .toc .toc li.color2.toc_current a, #tocframe .toc .toc li.color2.toc_current a:hover { - background: #ddefa3; -} - -#tocframe .toc .toc li.color3.toc_current a { - background: #fdf4a8; + background: #ddefa3 url(../pictures/color2-active.png) repeat-x top left; } +#tocframe .toc .toc li.color3.toc_current a, #tocframe .toc .toc li.color3.toc_current a:hover { - background: #fdf4a8; -} - -#tocframe .toc .toc li.color4.toc_current a { - background: #fcf7ae; + background: #fdf4a8 url(../pictures/color3-active.png) repeat-x top left; } +#tocframe .toc .toc li.color4.toc_current a, #tocframe .toc .toc li.color4.toc_current a:hover { - background: #fcf7ae; + background: #fcf7ae url(../pictures/color4-active.png) repeat-x top left; } /* third level toc (unnumberedsubsec) */ - #tocframe .toc .toc .toc { position: absolute; top: 2em; @@ -335,7 +356,9 @@ div#main { margin: 0 auto 11.7em; /* Necessary to stretch over floated content; * will cause scrollbars to appear for content - * that is wider than the width of this div + * that is wider than the width of this div. + * + * FIXME: This breaks Konqueror 3 and 4. */ overflow: auto; } @@ -391,7 +414,6 @@ div#quickSummary { background: #fff url(../pictures/summary-gradient.png) repeat-y 0 0; color: #fff; padding: 0 0.5em; - /* border-bottom: 10px solid #5b7f64; */ margin: 0; } @@ -400,6 +422,13 @@ div#quickSummary { margin: 0; } +div.separator { + background: transparent url(../pictures/squiggle.jpg) no-repeat 40% 60%; + height: 36px; + clear: both; + padding: 10px; +} + div#news { padding: 0; margin: 0 13em 1em 0; @@ -459,9 +488,18 @@ div#latestVersion { margin: 0; } +/* this might not work in certain browsers */ +a[name="Stable"] + h4 { + background: #bdee9d url(../pictures/color1-bg.png) repeat-x top left; +} + +/* this might not work in certain browsers */ +a[name="Unstable"] + h4 { + background: #fad58c url(../pictures/color3-bg.png) repeat-x top left; +} + #latestVersion .subsubheading { - background: #bdee9d; - padding: 0.18em 0.25em; + padding: 0.08em 0.25em; border-bottom: 1px solid #5b7f64; margin: 0; } @@ -502,10 +540,11 @@ div#language { } #verifier_texinfo { - position: absolute; - top: 0; + position: relative; + bottom: 0; right: 0; left: 50%; + width: 50%; } #verifier_texinfo h3 { @@ -534,10 +573,10 @@ div#language { h1.unnumbered, h2.unnumberedsec, h3.unnumberedsubsec { position: relative; height: 0; - overflow: hidden; text-indent: -999em; padding: 0; margin: 0; + overflow: hidden; } table { @@ -608,20 +647,19 @@ div.float-right a.clickable { } /* Columns */ - .column-center-top { float: left; width: 99.5%; - text-align: center; - border: 1px solid #8bbb6b; + text-align: left; + border: 1px solid #9ccc7c; margin: 1em auto; } /* color1 */ .column-center-top h3 { - background: #9ccc7c; + background: #9ccc7c url(../pictures/color1-bg.png) repeat-x top left; text-align: left; - border-bottom: 1px solid #8bbb6b; + border-bottom: 1px solid #9ccc7c; } .column-left-top { @@ -639,14 +677,14 @@ div.float-right a.clickable { .column-left-top, .column-left-bottom { - border: 1px solid #aabe70; + border: 1px solid #adce82; } /* color2 */ .column-left-top h3, .column-left-bottom h3 { - background: #bbcf81; - border-bottom: 1px solid #aabe70; + background: #adce82 url(../pictures/color2-bg.png) repeat-x top left; + border-bottom: 1px solid #adce82; } .column-right-top { @@ -663,29 +701,29 @@ div.float-right a.clickable { .column-right-top, .column-right-bottom { - border: 1px solid #cac175; + border: 1px solid #bdd088; } /* color3 */ .column-right-top h3, .column-right-bottom h3 { - background: #dbd286; - border-bottom: 1px solid #cac175; + background: #bdd088 url(../pictures/color3-bg.png) repeat-x top left; + border-bottom: 1px solid #bdd088; } .column-center-bottom { clear: both; width: 99.5%; text-align: center; - border: 1px solid #e9c47b; + border: 1px solid #ccd38f; margin: 1em auto 0; } /* color4 */ .column-center-bottom h3 { - background: #fad58c; + background: #ccd38f url(../pictures/color4-bg.png) repeat-x top left; text-align: left; - border-bottom: 1px solid #e9c47b; + border-bottom: 1px solid #ccd38f; } .column-center-top, @@ -703,6 +741,7 @@ div.float-right a.clickable { .column-left-bottom h3, .column-right-top h3, .column-right-bottom h3 { + text-align: left; padding: 0 0.5em; margin: 0; } @@ -713,6 +752,7 @@ div.float-right a.clickable { .column-left-bottom h4, .column-right-top h4, .column-right-bottom h4 { + text-align: left; padding: 0.5em 0.5em 0; margin: 0 0 0.5em 0; } @@ -764,7 +804,6 @@ div.float-right a.clickable { } /* Centered divs by color */ - div.color1, div.color2, div.color3, @@ -784,40 +823,40 @@ div.color4 h3 { } div.color1 { - border: 1px solid #8bbb6b; + border: 1px solid #9ccc7c; margin: 1em auto; } div.color1 h3 { background: #9ccc7c; - border-bottom: 1px solid #8bbb6b; + border-bottom: 1px solid #9ccc7c; } div.color2 { - border: 1px solid #aabe70; + border: 1px solid #adce82; } div.color2 h3 { - background: #bbcf81; - border-bottom: 1px solid #aabe70; + background: #adce82; + border-bottom: 1px solid #adce82; } div.color3 { - border: 1px solid #cac175; + border: 1px solid #bdd088; } div.color3 h3 { - background: #dbd286; - border-bottom: 1px solid #cac175; + background: #bdd088; + border-bottom: 1px solid #bdd088; } div.color4 { - border: 1px solid #e9c47b; + border: 1px solid #ccd38f; } div.color4 h3 { - background: #fad58c; - border-bottom: 1px solid #e9c47b; + background: #ccd38f; + border-bottom: 1px solid #ccd38f; } .keep-bullets ul { @@ -830,6 +869,23 @@ div.color4 h3 { padding: 0; } +.normal-table table { + padding : 0em; + border-left: 2px; + margin: 0em; +} + +.normal-table table td { + padding: 0em; +} + +.normal-table table a { +} + +.normal-table p { + line-height: 0.8; +} + .warning { background: #eef; text-align: left; @@ -868,14 +924,17 @@ div.color4 h3 { font-size: 0.6em; } +.detail { + font-size: 0.8em; +} + /* kill title, probably best done in the init file, though */ h1.settitle { position: relative; height: 0; - overflow: hidden; text-indent: -999em; padding: 0; margin: 0; + overflow: hidden; } -