X-Git-Url: http://shamusworld.gotdns.org/cgi-bin/gitweb.cgi?a=blobdiff_plain;f=source%2Fcss%2Fapp.css;h=0802831ecd928d12b7f472a96184454a0494d270;hb=3e47fa4419f952f1e8155e4fff892f24262e78a3;hp=3fb82b515e5c4d1d8b39aa6f55e058d373511df6;hpb=2e006d9b931807ddc386650766de3a5fe44a271b;p=ardour-manual diff --git a/source/css/app.css b/source/css/app.css index 3fb82b5..0802831 100644 --- a/source/css/app.css +++ b/source/css/app.css @@ -1,5 +1,5 @@ #tree { - background-color: #eee; + background-color: #212A30; height: 100%; overflow: scroll; position: fixed; @@ -10,7 +10,7 @@ } #tree-inner { - padding: 15px 20px 30px 30px; + padding: 15px 20px 30px 30px; } #tree h1.title { @@ -24,7 +24,7 @@ } #tree a { - font-size: 14px; + font-size: 14px; line-height: 28px; } @@ -37,7 +37,7 @@ #tree .child, #tree .parent *, #tree .child * { - display: inherit; + display: inherit; color: inherit; } @@ -45,7 +45,7 @@ #tree .child-2, #tree .child-3, #tree .child-4 { - display: none; + display: none; } @@ -68,14 +68,14 @@ #content dt, #content dd { font-size: 16px; - line-height: 28px; + line-height: 28px; } #tree a { display: inline !important; - font-weight: normal; - color: #666; + font-weight: normal; + color: #E4E4E4; border-bottom: 1px solid transparent; padding-bottom: 2px; } @@ -87,8 +87,8 @@ #tree .active > a { display: inline; - color: #000; - border-bottom: 1px solid #555; + color: #da0808; + border-bottom: 1px solid #FFF; } @@ -118,7 +118,7 @@ } #content h3 { - margin: 20px 0 10px 0; + margin: 20px 0 10px 0; padding-bottom: 5px; font-size: 20px; border-bottom: 1px solid #eee; @@ -127,7 +127,7 @@ #content h4 { font-size: 18px; - margin: 20px 0 10px 0; + margin: 20px 0 10px 0; padding-bottom: 10px; border-bottom: 1px solid #eee; } @@ -139,12 +139,19 @@ #content dl { - float: left; - width: 100%; + float:none; + clear:both; + width:100%; margin: 1em 0; padding: 0; } - + +#content dl:after { + content:' '; + display:block; + clear:both; +} + #content dt { clear: left; @@ -154,7 +161,7 @@ padding: 5px; font-weight: normal; } - + #content dd { float: left; @@ -164,6 +171,68 @@ font-weight: normal; } +#content dt.sub1 { + padding-left: 2em; +} + +#content dt.sub2 { + padding-left: 4em; +} + + +#content figure { + display: table; +} + +#content figcaption { + display: table-caption; + caption-side: bottom ; +} + +#content figcaption.titleover { + caption-side: top ; +} + +#content figure.right { + margin: 0 0 1em 1em; + float:right; + clear:right; +} + +#content figure.left { + margin: 0 1em 1em 0; + float:left; + clear:left; +} + +.multicol2 { + width: 48%; + float:left; + padding:0 0 0 2%; + margin:0; +} + +.multicol3 { + width: 31%; + float:left; + padding:0 0 0 2%; + margin:0; +} + +.multicol4 { + width: 23%; + float:left; + padding:0 0 0 2%; + margin:0; +} + +.multicol5 { + width: 18%; + float:left; + padding:0 0 0 2%; + margin:0; +} + /* Keyboard binding layout */ #content dl.bindings { @@ -172,23 +241,23 @@ margin: 1em 0; padding: 0; } - + #content .bindings dt { clear: left; float: left; - width: 30%; + width: 65%; margin: 0; padding: 0px; font-size: 100%; font-family: "Trebuchet MS", "Bitstream Vera Sans", Verdana, Arial, Helvetica, sans-serif; font-weight: normal; } - + #content .bindings dd { float: left; - width: 65%; + width: 30%; margin: 0; padding: 0px; font-size: 110%; @@ -204,7 +273,7 @@ margin: 1em 0; padding: 0; } - + #content .wide-table dt { font-weight: normal; @@ -224,7 +293,7 @@ #content dd:nth-child(2) { border-top: none; } - + #content .wide-table dd { float: left; @@ -240,7 +309,7 @@ margin: 1em 0; padding: 0; } - + #content .narrower-table dt { clear: left; @@ -249,7 +318,7 @@ margin: 0; padding: 5px; } - + #content .narrower-table dd { float: left; @@ -272,7 +341,7 @@ kbd { text-transform:capitalize; } -kbd.input,kbd.cmd { +kbd.input,kbd.cmd,kbd.osc { font-family:mono; border-width:0; text-transform:none; @@ -315,32 +384,33 @@ kbd.mouse { } */ -kbd.menu,kbd.option,kbd.optoff { +kbd.optoff, kbd.option { border:none; background-color:transparent; - font-weight:bold; - font-stretch:extra-condensed; - white-space:normal; } -kbd.option:after,kbd.optoff:after { - font-family:mono; - font-weight:lighter; - text-align:center; - border:solid 1px black; - -moz-border-radius:10px; - border-radius:10px; - margin-left:0.3em; +kbd.optoff:after { + content:url('/images/checkbox-unchecked.png'); } + kbd.option:after { - content:'X'; + content:url('/images/checkbox-checked.png'); +} +kbd.menu { + border:none; + background-color:transparent; + font-weight:bold; + font-stretch:extra-condensed; + white-space:normal; } -kbd.optoff:after { - content:' '; + + +kbd.osc { } + kbd.fader, kbd.knob, kbd.button { border-color:#ccccff #aaaadd #8888bb #bbbbee; background-color:#ddddff; @@ -353,7 +423,7 @@ kbd.fader { kbd.knob { -moz-border-radius:12px; - border-radius:12px; + border-radius:12px; border-width: 1px 1px 9px 9px; } @@ -398,27 +468,35 @@ samp:after { font-style: normal; } -#content .right { +#content img.right { margin: 0 0 1em 1em; float:right; + clear:right; } -#content .left { +#content img.left { margin:0 1em 1em 0; float:left; + clear:left; } -#content .note,.warning { +#content p.center { + text-align:center; +} + +#content .note,.warning,.fixme { min-height: 20px; padding: 19px; margin-bottom: 20px; - border: 1px solid + border-style: solid; + border-width: 1px 1px 1px 8px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); + } #content .note { @@ -427,69 +505,77 @@ samp:after { } #content .warning { - border-color: #990000; + border-color: #995555; background-color: #ffeeee; } +#content .fixme { + border-color: #999944; + background-color: #f0f0e0; + font-weight:bold; +} + +.fixme:before { + content:'FIXME: '; + font-style: italic; + font-size:200%; +} + + .mod1:before { content: "Ctrl "; } - .mod2:before { content: "Alt "; } - .mod3:before { content: "Shift "; } - .mod4:before { content: "Win "; } - .mod12:before { content: "Ctrl Alt "; } - .mod13:before { content: "Ctrl Shift "; } - .mod14:before { content: "Ctrl Win "; } +.mod23:before { + content: "Alt Shift "; +} +.kp:before { + content: "Keypad "; +} .mac .mod1:before { content: "Cmd "; } - .mac .mod2:before { content: "Ctrl "; } - .mac .mod3:before { content: "Shift "; } - .mac .mod4:before { content: "Opt "; } - .mac .mod12:before { content: "Cmd Ctrl "; } - .mac .mod13:before { content: "Cmd Shift "; } - .mac .mod14:before { content: "Cmd Opt "; } - - +.mac .mod23:before { + content: "Ctrl Shift "; +} #gs_tti0 { @@ -498,7 +584,29 @@ samp:after { } +@media (max-width: 800px) { + #tree { + position: relative; + height: 250px; + width: 100%; + margin-top: 20px; + } + #content { + padding-left: 20px; + margin-top: 0px; + } +} +#chapter { padding-top: 1em; padding-left: 1em; } +#subchapter { padding-left: 4em; } +#content table.alternate{ border-collapse:collapse; } +.alternate td{ padding:7px; border:#4e95f4 1px solid; } +.alternate tr{ background: #b8d1f3; } +.alternate tr:nth-child(odd){ background: #b8d1f3; } +.alternate tr:nth-child(even){ background: #dae5f4; } +.container { position:relative; border: none;} +.hoverimg { position: absolute; border: none; } +.hoverimg:hover{ z-index:100; box-shadow: 0 0 5px 5px lightgreen; }