From e25335596d5c77fd9edb8f806373a41cfdf90622 Mon Sep 17 00:00:00 2001 From: Ralph Amissah Date: Thu, 14 Aug 2008 01:30:04 -0400 Subject: html, css and related markup --- lib/sisu/v0/css.rb | 516 +++++++++++++++++++---------------------------------- 1 file changed, 184 insertions(+), 332 deletions(-) (limited to 'lib/sisu/v0/css.rb') diff --git a/lib/sisu/v0/css.rb b/lib/sisu/v0/css.rb index 52de3351..f4dfc15f 100644 --- a/lib/sisu/v0/css.rb +++ b/lib/sisu/v0/css.rb @@ -107,6 +107,7 @@ WOK body { color: black; background: "#ffffff"; + background-color: "#ffffff"; } /* table { @@ -128,9 +129,12 @@ WOK color: #003399; text-decoration: none; } -/* a:hover { color: #000000; + background-color: #f9f9aa; + } +/* + a:hover { border-bottom: 2px solid #777777; background-color: #fff3b6; } @@ -150,6 +154,7 @@ WOK margin-left: 5%; margin-right: 1%; } + #top_band { position: absolute; top: 0; @@ -197,7 +202,16 @@ WOK margin-left: 75%; width: 20%; } - ul, li, p { + + .norm, .bold { + line-height: 150%; + margin-left: 1em; + margin-right: 2em; + margin-top: 10px; + margin-bottom: 0px; + text-indent: 0mm; + } + p, h0, h1, h2, h3, h4, h5, h6 { display: block; font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman; font-size: 100%; @@ -205,15 +219,12 @@ WOK line-height: 150%; text-align: justify; margin-left: 1em; + margin-right: 2em; text-indent: 0mm; margin-top: 3px; margin-bottom: 3px; - /* margin-bottom:0; */ - margin-right: 2em; - /* width: 90%; */ - } - p.norm { } + p.norm { } p.i1 {margin-left: 2em;} p.i2 {margin-left: 3em;} p.i3 {margin-left: 4em;} @@ -223,40 +234,33 @@ WOK p.i7 {margin-left: 8em;} p.i8 {margin-left: 9em;} p.i9 {margin-left: 10em;} + p.code { font-family: inconsolata, andale mono, courier new, courier, monospace; font-size: 90%; text-align: left; } + p.caption { text-align: left; font-size: 80%; display: inline; } + p.endnote { - font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman; font-size: 96%; - font-weight: normal; line-height: 120%; text-align: left; - margin-left: 1em; - text-indent: 0mm; - margin-top: 3px; - margin-bottom: 3px; margin-right: 15mm; } p.endnote_indent { - font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman; font-size: 96%; - font-weight: normal; line-height: 120%; text-align: left; margin-left: 2em; - text-indent: 0mm; - margin-top: 3px; - margin-bottom: 3px; margin-right: 15mm; } + p.center { text-align: center; } @@ -272,25 +276,7 @@ WOK font-style: normal; background: #fff3b6; } - p.ocn, p.paranum { - font-size: 10px; - margin-top: 0px; - float: right; - width: 5%; - margin-bottom: 5px; - color: #777777; - margin-right: 5px; - text-align: right; - } - p.ocn_off, p.no_paranum { - display: none; - font-size: 10px; - margin-top: 0px; - margin-bottom: 5px; - color: #777777; - margin-right: 5px; - text-align: right; - } + p.small { font-size: 80%; margin-top: 0px; @@ -298,7 +284,8 @@ WOK margin-right: 6px; text-align: left; } - p.tiny { + + p.tiny, p.tiny_left, p.tiny_right, p.tiny_center { font-size: 10px; margin-top: 0px; margin-bottom: 0px; @@ -306,33 +293,23 @@ WOK margin-right: 6px; text-align: left; } + p.tiny { } p.tiny_left { - font-size: 10px; - margin-top: 0px; - margin-bottom: 0px; - color: #777777; margin-left: 0px; margin-right: 0px; text-align: left; } p.tiny_right { - font-size: 10px; - margin-top: 0px; - margin-bottom: 0px; - color: #777777; - margin-right: 5mm; + margin-right: 1em; text-align: right; } p.tiny_center { - font-size: 10px; - margin-top: 0px; - margin-bottom: 0px; - color: #777777; margin-left: 0px; margin-right: 0px; text-align: center; } - p.pane { + + p.pane, p.pane_title, p.pane_blurb, p.pane_link, p.pane_indent { font-size: 80%; margin-top: 0px; margin-bottom: 0px; @@ -340,39 +317,26 @@ WOK margin-right: 4px; text-align: left; } + p.pane { } p.pane_title { font-weight: bold; - font-size: 80%; - margin-top: 0px; margin-bottom: 0px; - margin-left: 2mm; - margin-right: 4px; - text-align: left; } p.pane_blurb { font-size: 10px; - margin-top: 0px; margin-bottom: 0px; - margin-left: 2mm; - margin-right: 4px; - text-align: left; } p.pane_link { font-size: 10px; - margin-top: 0px; margin-bottom: 0px; margin-left: 4mm; - margin-right: 4px; - text-align: left; } p.pane_indent { font-size: 10px; - margin-top: 0px; margin-bottom: 0px; margin-left: 4mm; - margin-right: 4px; - text-align: left; } + p.concordance_word { line-height: 150%; font-weight: bold; @@ -384,19 +348,17 @@ WOK font-size: 80%; color: #777777; display: inline; - margin-left: 0mm; - text-indent: 0mm; + margin-left: 0em; } p.concordance_object { font-size: 80%; - font-weight: normal; line-height: 120%; text-align: left; - margin-left: 15mm; - text-indent: 0mm; + margin-left: 3em; margin-top: 1px; margin-bottom: 3px; } + p.quickref { font-size: 10px; font-style: italic; @@ -416,6 +378,19 @@ WOK text-align: center; } + label.ocn { + width: 2%; + float: right; + top: 0; + font-size: 10px; + margin-top: 0px; + margin-bottom: 5px; + color: #777777; + margin-right: 5px; + text-align: right; + background-color: #ffffff; + } + table { } tr { } th, td { } @@ -431,76 +406,6 @@ WOK text-align: right; } - h0, h1, h2, h3, h4, h5, h6 { - display: block; - font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman; - font-weight: bold; - line-height: 120%; - margin-left: 5mm; - margin-right: 5mm; - text-align: left; - margin-top: 20px; - margin-bottom: 10px; - } - h1.center, h2.center, h3.center, h4.center, h5.center, h6.center { - text-align: center; - } - - ul { - list-style: none; - } - ul.horizontal { - list-style: none; - } - ul.vertical { - list-style: none; - } - - li { - background: url(../image/bullet_09.png) no-repeat 0px 6px; - padding-left: 20px; - display: block; - font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman; - font-weight: normal; - line-height: 150%; - text-align: left; - margin-left: 1em; - text-indent: 0mm; - margin-top: 3px; - margin-bottom: 3px; - margin-right: 10mm; - } - li.bullet { - margin-left: 1em; - } - li.i1 { - margin-left: 2em; - } - li.i2 { - margin-left: 3em; - } - li.i3 { - margin-left: 4em; - } - li.i4 { - margin-left: 5em; - } - li.i5 { - margin-left: 6em; - } - li.i6 { - margin-left: 7em; - } - li.i7 { - margin-left: 8em; - } - li.i8 { - margin-left: 9em; - } - li.i9 { - margin-left: 10em; - } - #horizontal_links { background: #eeeeee; margin-left: 5%; @@ -534,6 +439,7 @@ WOK #horizontal a:hover { color: #000077; } + #document_versions { position: absolute; top: 10mm; @@ -541,6 +447,7 @@ WOK width: 12%; float: right; } + #vertical_links { position: absolute; top: 10mm; @@ -550,22 +457,10 @@ WOK float: right; } #vertical { - /* background: none; */ padding: 0 12px 0px 0px; - /* border-top: 2px solid #000077; */ - /* border-bottom: 2px solid #000077; */ - /* margin-left: 33%; */ margin-left: 2%; margin-right: 2%; } -/* - #vertical { - padding: 0 12px 0px 0px; - border-top: 2px solid #000077; - border-bottom: 2px solid #000077; - margin-left: 33%; - margin-right: 33%; - } */ #vertical li { display: block; list-style-type: none; @@ -581,10 +476,40 @@ WOK color: #000077; } - li.doc { + ul, li { + list-style-type: none; + list-style: none; + padding-left: 20px; + display: block; + font-family: verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman; + font-weight: normal; + line-height: 150%; + text-align: left; + text-indent: 0mm; + margin-left: 1em; + margin-right: 2em; + margin-top: 3px; + margin-bottom: 3px; + } + + li { background: url(../image/bullet_09.png) no-repeat 0px 6px; - padding-left: 16px; - margin-left: 10px; + } + + ul { + } + li.bullet { margin-left: 1em; } + li.i1 { margin-left: 2em; } + li.i2 { margin-left: 3em; } + li.i3 { margin-left: 4em; } + li.i4 { margin-left: 5em; } + li.i5 { margin-left: 6em; } + li.i6 { margin-left: 7em; } + li.i7 { margin-left: 8em; } + li.i8 { margin-left: 9em; } + li.i9 { margin-left: 10em; } + + li.doc, li.ref, li.refcenter { margin-top: 0px; margin-bottom: 0px; margin-right: 0px; @@ -592,72 +517,65 @@ WOK font-style: normal; text-align: left; } + li.doc { + background: url(../image/bullet_09.png) no-repeat 0px 6px; + padding-left: 16px; + margin-left: 10px; + margin-right: 0px; + } li.ref { background: none; padding-left: 0; margin-left: 0; - margin-top: 0px; - margin-bottom: 0px; color: #777777; - font-size: 8px; - font-style: normal; - text-align: left; } li.refcenter { background: url(../image/bullet_09.png) no-repeat 0px 6px; - background: none; padding-left: 20px; margin-left: 10%; font-size: 9px; - margin-top: 0px; - margin-bottom: 0px; color: #777777; text-align: center; } li.refbold { - background: url(../image/bullet_09.png) no-repeat 0px 6px; + list-style-type: none; padding-left: 16px; margin-left: 0; - margin-top: 0px; - margin-bottom: 0px; margin-right: 10mm; - font-size: 8px; font-weight: bold; - text-align: left; } - h1 { - font-size: 120%; - margin-top: 20px; - } - h2 { - font-size: 115%; - margin-top: 20px; - } - h3 { - font-size: 110%; - margin-top: 20px; - } - h4 { - font-size: 105%; - } - h5 { - font-size: 100%; - } - h6 { - font-size: 100%; - } - h0 { - font-size: 80%; - } - h1.norm, h2.norm, h3.norm { - font-size: 110%; - margin-left: 1em; - margin-right: 15mm; + h0, h1, h2, h3, h4, h5, h6 { + font-weight: bold; + line-height: 120%; text-align: left; margin-top: 20px; margin-bottom: 10px; } + h4.norm, h5.norm, h6.norm { + margin-top: 10px; + margin-bottom: 0px; + } + h1.center, h2.center, h3.center, h4.center, h5.center, h6.center { + text-align: center; + } + h1 { font-size: 120%; } + h2 { font-size: 115%; } + h3 { font-size: 110%; } + h4 { font-size: 105%; } + h5 { font-size: 100%; } + h6 { font-size: 100%; } + h0 { font-size: 80%; } + + h1.i {margin-left: 2em;} + h2.i {margin-left: 3em;} + h3.i {margin-left: 4em;} + h4.i {margin-left: 5em;} + h5.i {margin-left: 6em;} + h6.i {margin-left: 7em;} + h7.i {margin-left: 8em;} + h8.i {margin-left: 9em;} + h9.i {margin-left: 10em;} h1.top_band { display: inline; text-align: left; @@ -708,202 +626,137 @@ WOK margin-right: 1mm; } - h4.norm, h5.norm, h6.norm { - font-size: 100%; - margin-left: 10mm; - margin-right: 15mm; - text-align: left; - margin-top: 10px; - margin-bottom: 0px; - } - - h1.i {margin-left: 10mm;} - h2.i {margin-left: 15mm;} - h3.i {margin-left: 20mm;} - h4.i {margin-left: 25mm;} - h5.i {margin-left: 30mm;} - h6.i {margin-left: 35mm;} - h7.i {margin-left: 40mm;} - h8.i {margin-left: 45mm;} - h9.i {margin-left: 50mm;} - - h1.banner { + .banner, .subbanner { font-weight: bold; text-align: center; - font-size: 120%; margin-left: 10mm; margin-right: 15mm; margin-top: 20px; margin-bottom: 10px; } + h1.banner { + font-size: 120%; + } h1.subbanner { - font-weight: bold; - text-align: center; font-size: 115%; - margin-left: 10mm; - margin-right: 15mm; - margin-top: 20px; - margin-bottom: 10px; } h2.banner { - font-weight: bold; - text-align: center; font-size: 110%; - margin-left: 10mm; - margin-right: 15mm; - margin-top: 20px; - margin-bottom: 10px; } h3.banner { - font-weight: bold; - text-align: center; color: #990000; font-size: 105%; - margin-left: 10mm; - margin-right: 15mm; - margin-top: 20px; - margin-bottom: 10px; } h4.banner { - font-weight: bold; - text-align: center; color: #ff0000; font-size: 100%; - margin-left: 10mm; - margin-right: 15mm; - margin-top: 20px; - margin-bottom: 10px; } h5.banner { - font-weight: bold; } h6.banner { - font-weight: bold; } - h1.toc { - margin-left: 10mm; - font-size: 115%; + .toc { + font-weight: normal; margin-top: 6px; margin-bottom: 6px; + } + h1.toc { + margin-left: 1em; + font-size: 115%; line-height: 150%; } h2.toc { - margin-left: 15mm; + margin-left: 2em; font-size: 110%; - margin-top: 6px; - margin-bottom: 6px; line-height: 140%; } h3.toc { - margin-left: 20mm; + margin-left: 3em; font-size: 105%; - margin-top: 6px; - margin-bottom: 6px; line-height: 120%; } h4.toc { - margin-left: 25mm; - font-weight: normal; + margin-left: 4em; font-size: 100%; - margin-top: 6px; - margin-bottom: 6px; line-height: 120%; } h5.toc { - margin-left: 30mm; - font-weight: normal; + margin-left: 5em; font-size: 95%; - margin-top: 6px; - margin-bottom: 6px; line-height: 110%; } h6.toc { - margin-left: 35mm; - font-weight: normal; + margin-left: 6em; font-size: 90%; - margin-top: 6px; - margin-bottom: 6px; line-height: 110%; } + .microtoc { + margin-top: 2px; + margin-bottom: 2px; + } + h1.microtoc { margin-left: 0mm; font-size: 115%; - margin-top: 2px; - margin-bottom: 2px; } h2.microtoc { margin-left: 5mm; font-size: 110%; - margin-top: 2px; - margin-bottom: 2px; } h3.microtoc { margin-left: 10mm; font-size: 105%; - margin-top: 2px; - margin-bottom: 2px; } h4.microtoc { margin-left: 15mm; font-weight: normal; font-size: 100%; - margin-top: 2px; - margin-bottom: 2px; } h5.microtoc { margin-left: 20mm; font-weight: normal; font-size: 95%; - margin-top: 2px; - margin-bottom: 2px; } h6.microtoc { margin-left: 25mm; font-weight: normal; font-size: 90%; - margin-top: 2px; - margin-bottom: 2px; } - h5.subtoc { - margin-left: 2em; + + .subtoc { margin-right: 34%; font-weight: normal; + } + h5.subtoc { + margin-left: 2em; font-size: 80%; margin-top: 2px; margin-bottom: 2px; } h6.subtoc { margin-left: 3em; - margin-right: 34%; - font-weight: normal; font-size: 75%; margin-top: 0px; margin-bottom: 0px; } -div.substance { + div.substance { width: 100%; background-color: #ffffff; -} -div.ocn { + } + div.ocn { width: 5%; float: right; top: 0; background-color: #ffffff; -} -div.endnote { + } + div.endnote { width: 95%; background-color: #fffffff; -} -/* -body { - font-size: 90%; - font-family: verdana, arial, sans-serif; -} -*/ -div.toc { + } + div.toc { position: absolute; float: left; margin: 0; @@ -913,56 +766,65 @@ div.toc { width: 13em; background-color: #eeeeee; margin-right:1em; -} -div.content { + } + div.content { margin: 0; padding: 0; border-left: 13em solid #ffffff; padding-left: 1em; -} -div.content:after { + } + div.content:after { content:' '; clear:both; display:block; height:0; overflow:hidden -} -div.footer { + } + div.footer { clear:left; padding: 0.5em; font-size: 80%; margin: 0; -} -div.toc ul { + } + div.toc ul { list-style: none; padding: 0; margin: 0; -} -div.toc li ul a, li ul span.currentlink -{ + } + div.toc li ul a, li ul span.currentlink + { font-weight: normal; font-size: 90%; padding-left: 2em; background-color: #eeeeee; -} -div.toc a, span.currentlink{ + } + div.toc a, span.currentlink{ display:block; text-decoration: none; padding-left: 0.5em; color: #0000aa; -} -span.currentlink { + } + + span.currentlink { text-decoration: none; background-color: #aaaaf9; -} -div.toc a:visited { + } + + div.toc a:visited { color: #0000aa; -} -div.toc a:hover { + } + div.toc a:hover { + color: #000000; background-color: #f9f9aa; -} + } + + .minitoc { + font-weight: normal; + margin-top: 2px; + margin-bottom: 2px; + } h1.minitoc, h2.minitoc, h3.minitoc { - margin-left: 0mm; + margin-left: 0em; font-weight: bold; text-align: left; font-size: 90%; @@ -970,26 +832,18 @@ div.toc a:hover { margin-bottom: 4px; } h4.minitoc { - margin-left: 0mm; - font-weight: normal; + margin-left: 0em; font-size: 90%; - margin-top: 2px; - margin-bottom: 2px; } h5.minitoc { - margin-left: 2mm; - font-weight: normal; + margin-left: 1em; font-size: 85%; - margin-top: 2px; - margin-bottom: 2px; } h6.minitoc { - margin-left: 4mm; - font-weight: normal; + margin-left: 2em; font-size: 85%; - margin-top: 2px; - margin-bottom: 2px; } + h1.c, h2.c, h3.c, h4.c, h5.c, h6.c, p.c { text-align: center } @@ -1147,8 +1001,7 @@ WOK margin-top: 2px; margin-bottom: 0px; } - p.norm { - } + p.norm { } p.h1 { font-family: #{fonts}; font-size: 120%; @@ -2095,8 +1948,7 @@ WOK margin-bottom: 0px; margin-right: 5mm } - p.norm { - } + p.norm { } p.endnote { font-size: 100%; margin-left: 20%; -- cgit v1.2.3