X-Git-Url: http://git.rot13.org/?a=blobdiff_plain;f=BookReader%2FBookReader.css;h=56164d2329b79a393e5fa6db743c53eb3b98ed0e;hb=f46f1f50b0e5f87c7ab744f2e6bbf867a2502c59;hp=c0ff5cd4fb4684fff81e5f97f396fb432e54c43d;hpb=0cb1153f073d3f3406700c72b0e00048224a5b17;p=bookreader.git diff --git a/BookReader/BookReader.css b/BookReader/BookReader.css index c0ff5cd..56164d2 100644 --- a/BookReader/BookReader.css +++ b/BookReader/BookReader.css @@ -27,16 +27,19 @@ h3 { width: 100%; z-index: 100; background-color: #e2dcc5; + overflow: hidden; } #BRtoolbar .label { font-size: 1.1em; color: #999; } #BRtoolbar a { - color: #ccc!important; + color: #ccc; text-decoration: underline; } - +#BRtoolbarbuttons { + float: right; +} #BRcontainer { top:5px; bottom:5px; @@ -176,7 +179,26 @@ h3 { font-size: 12px; font-weight: 700; } - +#BRreturn { + /* display: block; */ + /* float: left; */ + /* margin: 0 10px 0 5px; */ + font-family: "Lucida Grande","Arial",sans-serif; + color: #333; + height: 20px; +} +#BRreturn span { + font-size: 12px; + display: block; + height: 12px; +} +#BRreturn a { + font-size: 14px; + display: block; + color: #036daa; + height: 18px; + overflow: hidden; +} .BRicon { display: block; float: left; @@ -195,7 +217,7 @@ h3 { .BRicon.logo {background-position:0 0;} .BRicon.info {background-position:-40px 0;} .BRicon.info:hover {background-position:-80px 0;} -.BRicon.share {background-position:-120px 0;cursor:default;} +.BRicon.share {background-position:-120px 0;} .BRicon.share:hover {background-position:-160px 0;} .BRicon.read {background-position:-200px 0;} .BRicon.read:hover {background-position:-240px 0;} @@ -207,6 +229,14 @@ h3 { .BRicon.book_left:hover {background-position:-480px 0;} .BRicon.book_right {background-position:-520px 0;} .BRicon.book_right:hover {background-position:-560px 0;} +.BRicon.zoom_out {background-position:-606px 0;} +.BRicon.zoom_out:hover {background-position:-646px 0;} +.BRicon.zoom_in {background-position:-686px 0;} +.BRicon.zoom_in:hover {background-position:-726px 0;} +.BRicon.play {background-position:-760px 0;} +.BRicon.play:hover {background-position:-800px 0;} +.BRicon.pause {background-position:-840px 0;} +.BRicon.pause:hover {background-position:-880px 0;} /* NOT CURRENTLY IN USE @@ -220,10 +250,6 @@ h3 { .BRicon.thumb:hover {background-position:-720px 0;} .BRicon.twopg {background-position:-760px 0;display:none;} .BRicon.twopg:hover {background-position:-800px 0;} -.BRicon.zoom_out {background-position:;} -.BRicon.zoom_out:hover {background-position:;} -.BRicon.zoom_in {background-position:;} -.BRicon.zoom_in:hover {background-position:;} .BRicon.one_page_mode {background-position:;} .BRicon.two_page_mode {background-position:;} .BRicon.thumbnail_mode {background-position:;} @@ -233,14 +259,13 @@ h3 { .BRicon.book_rightmost {background-position:;} .BRicon.book_top {background-position:;} .BRicon.book_bottom {background-position:;} -.BRicon.play {background-position:;} -.BRicon.pause {background-position:;} */ a.logo { display: block; float: left; width: 40px; height: 40px; + margin-right: 10px; background: transparent url(images/icon_home.png) no-repeat 0 0; } a.popOff { @@ -269,14 +294,16 @@ form#booksearch { } form#booksearch input[type=search] { width: 280px; - height: 24px; - line-height: 24px; + height: 22px; + line-height: 22px; font-family: "Arial", sans-serif; - font-size: 12px; + font-size: 13px; -webkit-appearance: textfield; -moz-appearance: textfield; appearance: field; - margin-top: 9px; + margin: 9px 0 0 0; + padding: 0; + border: 1px inset #ccc; } form#booksearch button { width: 30px; @@ -401,34 +428,90 @@ div#BRnav { } div#BRnavpos { position: relative; - width: 100%; + margin-right: 80px; height: 40px; } div#BRpager { position: relative; - margin: 0 92px 0 -10px; + + /* Account for padding around nav line */ + margin-left: 10px; + margin-right: 10px; + height: 40px; } div#BRslider { position: absolute; + top: 13px; + height: 27px; +} + +/* XXXmang verify correct use of handle class */ +#BRpager .ui-slider-handle { + position: absolute; + width: 23px; height: 27px; + top: 13px; + margin-left: -12px; /* Center icon */ + background: url(images/slider.png); + z-index: 103; +} + /* + width: 8px; + height: 14px; + position: absolute; + top: -4px; + background: #478AFF; + border: solid 1px black; +} +*/ + +div#BRfiller { + position: absolute; + height: 40px; + width: 10px; + background-color: #e2dcc5; + top: 0; + left: 0; + z-index: 102; } div#slider { position: absolute; width: 2500px; height: 27px; - top: 13px; + top: 0; left: -2478px; background-color: #000; opacity: .1; + z-index: 101; } div#pager { position: absolute; width: 23px; height: 27px; - top: 13px; + top: 0; left: 8px; background: url(images/slider.png); + z-index: 103; +} +div#pagenum { + display: none; + position: absolute; + left: 24px; + top: 4px; + color: #999; + font-size: 11px; + line-height: 19px; + font-weight: 700; + padding: 0 5px; + width: 80px; + text-align: right; + background-color: #000; + font-family: "Lucida Grande", "Arial", sans-serif; +} +div#pagenum span { + color: #ffa337; + font-style: italic; } div#BRnavline { position: relative; @@ -436,7 +519,7 @@ div#BRnavline { width: auto; background-color: #000; top: -29px; - margin: 0 92px 0 10px; + margin: 0 10px; } .BRnavend { position: absolute; @@ -453,12 +536,16 @@ div#BRnavline { } div.chapter { position: absolute; - top: -13px; + top: -24px; /* Relative to nav line */ width: 18px; + margin-left: -9px; /* Center marker triangle */ height: 27px; - background: transparent url(images/marker_chap.png) no-repeat; + background: transparent url(images/marker_chap-off.png) no-repeat; cursor: pointer; } +div.chapter.front { + background: transparent url(images/marker_chap-on.png) no-repeat; +} div.chapter div.title { display: none; } @@ -468,9 +555,10 @@ div.title span { } div.search { position: absolute; - top: -13px; width: 18px; + margin-left: -9px; /* Center icon */ height: 27px; + bottom: 0; /* Relative to nav line */ background-color: transparent; background-image: url(images/marker_srch-off.png); background-repeat: no-repeat; @@ -536,3 +624,78 @@ div.searchChap.front { #BRnav .front { z-index: 10001; } +div#BRzoomer { + position: fixed; + bottom: 40px; + right: 0; + width: 26px; + height: 190px; + z-index: 100; +} +div#BRzoompos { + position: relative; + width: 26px; + height: 190px; + top: 0; + left: 0; +} +div#BRzoomer button { + position: absolute; + left: 0; + background-color: #e2dcc5; + width: 26px; +} +div#BRzoomer button:hover { + background-color: #000; +} +div#BRzoomer .zoom_out { + top: 0; + -webkit-border-top-left-radius: 6px; + -webkit-border-bottom-left-radius: 6px; + -moz-border-radius-topleft: 6px; + -moz-border-radius-bottomleft: 6px; + border-top-left-radius: 6px; + border-bottom-left-radius: 6px; + -webkit-box-shadow: 2px 2px 2px #333; + -moz-box-shadow: 2px 2px 2px #333; + box-shadow: 2px 2px 2px #333; +} +div#BRzoomer .zoom_in { + bottom: 0; + -webkit-border-top-left-radius: 6px; + -moz-border-radius-topleft: 6px; + border-top-left-radius: 6px; +} +div#BRzoomcontrol { + position: relative; + top: 40px; + left:3px; + width: 23px; + height: 110px; +} +div#BRzoomstrip { + position: absolute; + top: 0; + left: 0; + width: 23px; + height: 110px; + background-color: #000; + opacity: .1; +} +div#BRzoombtn { + position: absolute; + width: 23px; + height: 23px; + top: 0; + left: 0; + background: url("images/icon_zoomer.png"); +} + +.BRttsPopUp { + position: absolute; + background-color: #E6E4E1; + background-image: url(images/progressbar.gif); + background-repeat:no-repeat; + font-size: 0.8em; + z-index: 3; +}