wip #1942 @1

diff --git a/style/fluidbook.less b/style/fluidbook.less
index 92f92dcfa8405d4c4964992a9642f6e43d339276..2e8873cc5512d0800abf561498f53e91a047c35d 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -228,6 +228,11 @@ body, html {
        iframe {
                width: 100%;
                height: 100%;
+               -webkit-transform-origin: 0 0 0;
+               -moz-transform-origin: 0 0 0;
+               -ms-transform-origin: 0 0 0;
+               -o-transform-origin: 0 0 0;
+               transform-origin: 0 0 0;
        }
 }
 
@@ -1070,6 +1075,71 @@ html.ios body.portrait #interface {
                }
        }
 
+       &[data-menu="bookmarks-help"] {
+               .content {
+                       padding: 40px 70px 100px 70px;
+                       p {
+                               margin-bottom: 60px;
+                               font-size: 0.9em;
+                               text-align: center;
+                       }
+
+                       @w: 147px;
+                       .doubleThumb {
+                               position: relative;
+                               width: @w*2;
+                               height: @w/@book-page-ratio;
+                               margin: 0 auto;
+                               .thumb {
+                                       &:before {
+                                               display: none;
+                                       }
+                                       &.left {
+                                               margin-right: @w;
+                                       }
+                                       &.right {
+                                               left: @w;
+                                               .img {
+                                                       &:after {
+                                                               left: auto;
+                                                               right: -24px;
+                                                       }
+                                               }
+                                       }
+                                       a.bookmark {
+                                               pointer-events: none;
+                                       }
+                                       .img {
+                                               position: relative;
+                                               width: @w;
+                                               height: @w/@book-page-ratio;
+                                               &:after {
+                                                       content: "";
+                                                       position: absolute;
+                                                       z-index: -1;
+                                                       top: -24px;
+                                                       left: -24px;
+                                                       width: 90px;
+                                                       height: 90px;
+                                                       background-color: @menu-background;
+                                                       border: 2px solid #fff;
+                                                       border-radius: 50%;
+                                               }
+
+                                       }
+
+                                       .bookmark {
+                                               width: 60px;
+                                               height: 60px;
+                                               z-index: 2;
+                                       }
+
+                               }
+                       }
+               }
+
+       }
+
        &[data-menu="webvideo"], &[data-menu="webvideo"] {
                iframe {
                        width: 100%;