diff options
Diffstat (limited to 'public/vendor/plugins/pdfjs/web/viewer.css')
-rw-r--r-- | public/vendor/plugins/pdfjs/web/viewer.css | 735 |
1 files changed, 504 insertions, 231 deletions
diff --git a/public/vendor/plugins/pdfjs/web/viewer.css b/public/vendor/plugins/pdfjs/web/viewer.css index da2cf65330..82766d66ef 100644 --- a/public/vendor/plugins/pdfjs/web/viewer.css +++ b/public/vendor/plugins/pdfjs/web/viewer.css @@ -24,16 +24,13 @@ line-height: 1.0; } -.textLayer > div { +.textLayer > span { color: transparent; position: absolute; white-space: pre; cursor: text; -webkit-transform-origin: 0% 0%; - -moz-transform-origin: 0% 0%; - -o-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - transform-origin: 0% 0%; + transform-origin: 0% 0%; } .textLayer .highlight { @@ -60,9 +57,10 @@ background-color: rgb(0, 100, 0); } -.textLayer ::selection { background: rgb(0,0,255); } .textLayer ::-moz-selection { background: rgb(0,0,255); } +.textLayer ::selection { background: rgb(0,0,255); } + .textLayer .endOfContent { display: block; position: absolute; @@ -73,8 +71,9 @@ z-index: -1; cursor: default; -webkit-user-select: none; - -ms-user-select: none; - -moz-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .textLayer .endOfContent.active { @@ -86,7 +85,8 @@ position: absolute; } -.annotationLayer .linkAnnotation > a { +.annotationLayer .linkAnnotation > a, +.annotationLayer .buttonWidgetAnnotation.pushButton > a { position: absolute; font-size: 1em; top: 0; @@ -95,11 +95,8 @@ height: 100%; } -.annotationLayer .linkAnnotation > a /* -ms-a */ { - background: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") 0 0 repeat; -} - -.annotationLayer .linkAnnotation > a:hover { +.annotationLayer .linkAnnotation > a:hover, +.annotationLayer .buttonWidgetAnnotation.pushButton > a:hover { opacity: 0.2; background: #ff0; box-shadow: 0px 2px 10px #ff0; @@ -110,6 +107,119 @@ cursor: pointer; } +.annotationLayer .textWidgetAnnotation input, +.annotationLayer .textWidgetAnnotation textarea, +.annotationLayer .choiceWidgetAnnotation select, +.annotationLayer .buttonWidgetAnnotation.checkBox input, +.annotationLayer .buttonWidgetAnnotation.radioButton input { + background-color: rgba(0, 54, 255, 0.13); + border: 1px solid transparent; + box-sizing: border-box; + font-size: 9px; + height: 100%; + margin: 0; + padding: 0 3px; + vertical-align: top; + width: 100%; +} + +.annotationLayer .choiceWidgetAnnotation select option { + padding: 0; +} + +.annotationLayer .buttonWidgetAnnotation.radioButton input { + border-radius: 50%; +} + +.annotationLayer .textWidgetAnnotation textarea { + font: message-box; + font-size: 9px; + resize: none; +} + +.annotationLayer .textWidgetAnnotation input[disabled], +.annotationLayer .textWidgetAnnotation textarea[disabled], +.annotationLayer .choiceWidgetAnnotation select[disabled], +.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled], +.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] { + background: none; + border: 1px solid transparent; + cursor: not-allowed; +} + +.annotationLayer .textWidgetAnnotation input:hover, +.annotationLayer .textWidgetAnnotation textarea:hover, +.annotationLayer .choiceWidgetAnnotation select:hover, +.annotationLayer .buttonWidgetAnnotation.checkBox input:hover, +.annotationLayer .buttonWidgetAnnotation.radioButton input:hover { + border: 1px solid #000; +} + +.annotationLayer .textWidgetAnnotation input:focus, +.annotationLayer .textWidgetAnnotation textarea:focus, +.annotationLayer .choiceWidgetAnnotation select:focus { + background: none; + border: 1px solid transparent; +} + +.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before, +.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after, +.annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before { + background-color: #000; + content: ''; + display: block; + position: absolute; +} + +.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before, +.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after { + height: 80%; + left: 45%; + width: 1px; +} + +.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before { + -webkit-transform: rotate(45deg); + transform: rotate(45deg); +} + +.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after { + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); +} + +.annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before { + border-radius: 50%; + height: 50%; + left: 30%; + top: 20%; + width: 50%; +} + +.annotationLayer .textWidgetAnnotation input.comb { + font-family: monospace; + padding-left: 2px; + padding-right: 0; +} + +.annotationLayer .textWidgetAnnotation input.comb:focus { + /* + * Letter spacing is placed on the right side of each character. Hence, the + * letter spacing of the last character may be placed outside the visible + * area, causing horizontal scrolling. We avoid this by extending the width + * when the element has focus and revert this when it loses focus. + */ + width: 115%; +} + +.annotationLayer .buttonWidgetAnnotation.checkBox input, +.annotationLayer .buttonWidgetAnnotation.radioButton input { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + padding: 0; +} + .annotationLayer .popupWrapper { position: absolute; width: 20em; @@ -125,23 +235,34 @@ padding: 0.6em; margin-left: 5px; cursor: pointer; + font: message-box; word-wrap: break-word; } .annotationLayer .popup h1 { font-size: 1em; border-bottom: 1px solid #000000; + margin: 0; padding-bottom: 0.2em; } .annotationLayer .popup p { + margin: 0; padding-top: 0.2em; } .annotationLayer .highlightAnnotation, .annotationLayer .underlineAnnotation, .annotationLayer .squigglyAnnotation, -.annotationLayer .strikeoutAnnotation { +.annotationLayer .strikeoutAnnotation, +.annotationLayer .lineAnnotation svg line, +.annotationLayer .squareAnnotation svg rect, +.annotationLayer .circleAnnotation svg ellipse, +.annotationLayer .polylineAnnotation svg polyline, +.annotationLayer .polygonAnnotation svg polygon, +.annotationLayer .inkAnnotation svg polyline, +.annotationLayer .stampAnnotation, +.annotationLayer .fileAttachmentAnnotation { cursor: pointer; } @@ -158,7 +279,8 @@ overflow: visible; border: 9px solid transparent; background-clip: content-box; - border-image: url(images/shadow.png) 9 9 repeat; + -o-border-image: url(images/shadow.png) 9 9 repeat; + border-image: url(images/shadow.png) 9 9 repeat; background-color: white; } @@ -167,11 +289,64 @@ border: none; } +.pdfViewer.singlePageView { + display: inline-block; +} + +.pdfViewer.singlePageView .page { + margin: 0; + border: none; +} + +.pdfViewer.scrollHorizontal, .pdfViewer.scrollWrapped, .spread { + margin-left: 3.5px; + margin-right: 3.5px; + text-align: center; +} + +.pdfViewer.scrollHorizontal, .spread { + white-space: nowrap; +} + +.pdfViewer.removePageBorders, +.pdfViewer.scrollHorizontal .spread, +.pdfViewer.scrollWrapped .spread { + margin-left: 0; + margin-right: 0; +} + +.spread .page, +.pdfViewer.scrollHorizontal .page, +.pdfViewer.scrollWrapped .page, +.pdfViewer.scrollHorizontal .spread, +.pdfViewer.scrollWrapped .spread { + display: inline-block; + vertical-align: middle; +} + +.spread .page, +.pdfViewer.scrollHorizontal .page, +.pdfViewer.scrollWrapped .page { + margin-left: -3.5px; + margin-right: -3.5px; +} + +.pdfViewer.removePageBorders .spread .page, +.pdfViewer.removePageBorders.scrollHorizontal .page, +.pdfViewer.removePageBorders.scrollWrapped .page { + margin-left: 5px; + margin-right: 5px; +} + .pdfViewer .page canvas { margin: 0; display: block; } +.pdfViewer .page canvas[hidden] { + display: none; +} + .pdfViewer .page .loadingIcon { position: absolute; display: block; @@ -182,6 +357,26 @@ background: url('images/loading-icon.gif') center no-repeat; } +.pdfPresentationMode .pdfViewer { + margin-left: 0; + margin-right: 0; +} + +.pdfPresentationMode .pdfViewer .page, +.pdfPresentationMode .pdfViewer .spread { + display: block; +} + +.pdfPresentationMode .pdfViewer .page, +.pdfPresentationMode .pdfViewer.removePageBorders .page { + margin-left: auto; + margin-right: auto; +} + +.pdfPresentationMode:-ms-fullscreen .pdfViewer .page { + margin-bottom: 100% !important; +} + .pdfPresentationMode:-webkit-full-screen .pdfViewer .page { margin-bottom: 100%; border: 0; @@ -192,16 +387,15 @@ border: 0; } -.pdfPresentationMode:-ms-fullscreen .pdfViewer .page { - margin-bottom: 100% !important; - border: 0; -} - .pdfPresentationMode:fullscreen .pdfViewer .page { margin-bottom: 100%; border: 0; } +:root { + --sidebar-width: 200px; +} + * { padding: 0; margin: 0; @@ -209,12 +403,14 @@ html { height: 100%; + width: 100%; /* Font size is needed to make the activity bar the correct size. */ font-size: 10px; } body { height: 100%; + width: 100%; background-color: #404040; background-image: url(images/texture.png); } @@ -234,6 +430,15 @@ select { display: none !important; } +#viewerContainer.pdfPresentationMode:-ms-fullscreen { + top: 0px !important; + overflow: hidden !important; +} + +#viewerContainer.pdfPresentationMode:-ms-fullscreen::-ms-backdrop { + background-color: #000; +} + #viewerContainer.pdfPresentationMode:-webkit-full-screen { top: 0px; border-top: 2px solid transparent; @@ -243,6 +448,7 @@ select { overflow: hidden; cursor: none; -webkit-user-select: none; + user-select: none; } #viewerContainer.pdfPresentationMode:-moz-full-screen { @@ -254,20 +460,19 @@ select { overflow: hidden; cursor: none; -moz-user-select: none; + user-select: none; } #viewerContainer.pdfPresentationMode:-ms-fullscreen { - top: 0px !important; + top: 0px; border-top: 2px solid transparent; + background-color: #000; width: 100%; height: 100%; - overflow: hidden !important; + overflow: hidden; cursor: none; -ms-user-select: none; -} - -#viewerContainer.pdfPresentationMode:-ms-fullscreen::-ms-backdrop { - background-color: #000; + user-select: none; } #viewerContainer.pdfPresentationMode:fullscreen { @@ -279,8 +484,9 @@ select { overflow: hidden; cursor: none; -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } .pdfPresentationMode:-webkit-full-screen a:not(.internalLink) { @@ -292,60 +498,34 @@ select { } .pdfPresentationMode:-ms-fullscreen a:not(.internalLink) { - display: none !important; + display: none; } .pdfPresentationMode:fullscreen a:not(.internalLink) { display: none; } -.pdfPresentationMode:-webkit-full-screen .textLayer > div { +.pdfPresentationMode:-webkit-full-screen .textLayer > span { cursor: none; } -.pdfPresentationMode:-moz-full-screen .textLayer > div { +.pdfPresentationMode:-moz-full-screen .textLayer > span { cursor: none; } -.pdfPresentationMode:-ms-fullscreen .textLayer > div { +.pdfPresentationMode:-ms-fullscreen .textLayer > span { cursor: none; } -.pdfPresentationMode:fullscreen .textLayer > div { +.pdfPresentationMode:fullscreen .textLayer > span { cursor: none; } .pdfPresentationMode.pdfPresentationModeControls > *, -.pdfPresentationMode.pdfPresentationModeControls .textLayer > div { +.pdfPresentationMode.pdfPresentationModeControls .textLayer > span { cursor: default; } -/* outer/inner center provides horizontal center */ -.outerCenter { - pointer-events: none; - position: relative; -} -html[dir='ltr'] .outerCenter { - float: right; - right: 50%; -} -html[dir='rtl'] .outerCenter { - float: left; - left: 50%; -} -.innerCenter { - pointer-events: auto; - position: relative; -} -html[dir='ltr'] .innerCenter { - float: right; - right: -50%; -} -html[dir='rtl'] .innerCenter { - float: left; - left: -50%; -} - #outerContainer { width: 100%; height: 100%; @@ -354,35 +534,51 @@ html[dir='rtl'] .innerCenter { #sidebarContainer { position: absolute; - top: 0; + top: 32px; bottom: 0; - width: 200px; + width: 200px; /* Here, and elsewhere below, keep the constant value for compatibility + with older browsers that lack support for CSS variables. */ + width: var(--sidebar-width); visibility: hidden; - -webkit-transition-duration: 200ms; - -webkit-transition-timing-function: ease; + z-index: 100; + border-top: 1px solid #333; + transition-duration: 200ms; transition-timing-function: ease; - } html[dir='ltr'] #sidebarContainer { - -webkit-transition-property: left; transition-property: left; left: -200px; + left: calc(-1 * var(--sidebar-width)); } html[dir='rtl'] #sidebarContainer { - -webkit-transition-property: right; transition-property: right; right: -200px; + right: calc(-1 * var(--sidebar-width)); } -#outerContainer.sidebarMoving > #sidebarContainer, -#outerContainer.sidebarOpen > #sidebarContainer { +.loadingInProgress #sidebarContainer { + top: 36px; +} + +#outerContainer.sidebarResizing #sidebarContainer { + /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */ + transition-duration: 0s; + /* Prevent e.g. the thumbnails being selected when the sidebar is resized. */ + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +#outerContainer.sidebarMoving #sidebarContainer, +#outerContainer.sidebarOpen #sidebarContainer { visibility: visible; } -html[dir='ltr'] #outerContainer.sidebarOpen > #sidebarContainer { +html[dir='ltr'] #outerContainer.sidebarOpen #sidebarContainer { left: 0px; } -html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer { +html[dir='rtl'] #outerContainer.sidebarOpen #sidebarContainer { right: 0px; } @@ -393,20 +589,6 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer { bottom: 0; left: 0; min-width: 320px; - -webkit-transition-duration: 200ms; - -webkit-transition-timing-function: ease; - transition-duration: 200ms; - transition-timing-function: ease; -} -html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer { - -webkit-transition-property: left; - transition-property: left; - left: 200px; -} -html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer { - -webkit-transition-property: right; - transition-property: right; - right: 200px; } #sidebarContent { @@ -415,7 +597,7 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer { overflow: auto; -webkit-overflow-scrolling: touch; position: absolute; - width: 200px; + width: 100%; background-color: hsla(0,0%,0%,.1); } html[dir='ltr'] #sidebarContent { @@ -437,6 +619,10 @@ html[dir='rtl'] #sidebarContent { left: 0; outline: none; } +#viewerContainer:not(.pdfPresentationMode) { + transition-duration: 200ms; + transition-timing-function: ease; +} html[dir='ltr'] #viewerContainer { box-shadow: inset 1px 0 0 hsla(0,0%,100%,.05); } @@ -444,6 +630,22 @@ html[dir='rtl'] #viewerContainer { box-shadow: inset -1px 0 0 hsla(0,0%,100%,.05); } +#outerContainer.sidebarResizing #viewerContainer { + /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */ + transition-duration: 0s; +} + +html[dir='ltr'] #outerContainer.sidebarOpen #viewerContainer:not(.pdfPresentationMode) { + transition-property: left; + left: 200px; + left: var(--sidebar-width); +} +html[dir='rtl'] #outerContainer.sidebarOpen #viewerContainer:not(.pdfPresentationMode) { + transition-property: right; + right: 200px; + right: var(--sidebar-width); +} + .toolbar { position: relative; left: 0; @@ -457,7 +659,7 @@ html[dir='rtl'] #viewerContainer { } #toolbarSidebar { - width: 200px; + width: 100%; height: 32px; background-color: #424242; /* fallback */ background-image: url(images/texture.png), @@ -476,6 +678,21 @@ html[dir='rtl'] #toolbarSidebar { 0 0 1px hsla(0,0%,0%,.1); } +#sidebarResizer { + position: absolute; + top: 0; + bottom: 0; + width: 6px; + z-index: 200; + cursor: ew-resize; +} +html[dir='ltr'] #sidebarResizer { + right: -6px; +} +html[dir='rtl'] #sidebarResizer { + left: -6px; +} + #toolbarContainer, .findbar, .secondaryToolbar { position: relative; height: 32px; @@ -484,15 +701,13 @@ html[dir='rtl'] #toolbarSidebar { linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95)); } html[dir='ltr'] #toolbarContainer, .findbar, .secondaryToolbar { - box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08), - inset 0 1px 1px hsla(0,0%,0%,.15), + box-shadow: inset 0 1px 1px hsla(0,0%,0%,.15), inset 0 -1px 0 hsla(0,0%,100%,.05), 0 1px 0 hsla(0,0%,0%,.15), 0 1px 1px hsla(0,0%,0%,.1); } html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { - box-shadow: inset -1px 0 0 hsla(0,0%,100%,.08), - inset 0 1px 1px hsla(0,0%,0%,.15), + box-shadow: inset 0 1px 1px hsla(0,0%,0%,.15), inset 0 -1px 0 hsla(0,0%,100%,.05), 0 1px 0 hsla(0,0%,0%,.15), 0 1px 1px hsla(0,0%,0%,.1); @@ -518,7 +733,6 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { height: 100%; background-color: #ddd; overflow: hidden; - -webkit-transition: width 200ms; transition: width 200ms; } @@ -534,7 +748,6 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { #loadingBar .progress.indeterminate { background-color: #999; - -webkit-transition: none; transition: none; } @@ -551,15 +764,15 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { #ddd 95px, #bbb 100px); -webkit-animation: progressIndeterminate 950ms linear infinite; - animation: progressIndeterminate 950ms linear infinite; + + animation: progressIndeterminate 950ms linear infinite; } .findbar, .secondaryToolbar { top: 32px; position: absolute; z-index: 10000; - height: 32px; - + height: auto; min-width: 16px; padding: 0px 6px 0px 6px; margin: 4px 2px 4px 2px; @@ -570,19 +783,47 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar { cursor: default; } +.findbar { + min-width: 300px; +} +.findbar > div { + height: 32px; +} +.findbar.wrapContainers > div { + clear: both; +} +.findbar.wrapContainers > div#findbarMessageContainer { + height: auto; +} html[dir='ltr'] .findbar { left: 68px; } - html[dir='rtl'] .findbar { right: 68px; } .findbar label { -webkit-user-select: none; - -moz-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } +#findInput { + width: 200px; +} +#findInput::-webkit-input-placeholder { + color: hsl(0, 0%, 75%); +} +#findInput:-ms-input-placeholder { + font-style: italic; +} +#findInput::-ms-input-placeholder { + font-style: italic; +} +#findInput::placeholder { + font-style: italic; +} #findInput[data-status="pending"] { background-image: url(images/loading-small.png); background-repeat: no-repeat; @@ -612,6 +853,11 @@ html[dir='rtl'] .secondaryToolbar { margin-bottom: -4px; } +#secondaryToolbarButtonContainer.hiddenScrollModeButtons > .scrollModeButtons, +#secondaryToolbarButtonContainer.hiddenSpreadModeButtons > .spreadModeButtons { + display: none !important; +} + .doorHanger, .doorHangerRight { border: 1px solid hsla(0,0%,0%,.5); @@ -674,41 +920,40 @@ html[dir='ltr'] .doorHangerRight:before { font-style: italic; color: #A6B7D0; } +#findMsg:empty { + display: none; +} #findInput.notFound { background-color: rgb(255, 102, 102); } -html[dir='ltr'] #toolbarViewerLeft { - margin-left: -1px; -} -html[dir='rtl'] #toolbarViewerRight { - margin-right: -1px; +#toolbarViewerMiddle { + position: absolute; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); } html[dir='ltr'] #toolbarViewerLeft, html[dir='rtl'] #toolbarViewerRight { - position: absolute; - top: 0; - left: 0; + float: left; } html[dir='ltr'] #toolbarViewerRight, html[dir='rtl'] #toolbarViewerLeft { - position: absolute; - top: 0; - right: 0; + float: right; } html[dir='ltr'] #toolbarViewerLeft > *, html[dir='ltr'] #toolbarViewerMiddle > *, html[dir='ltr'] #toolbarViewerRight > *, -html[dir='ltr'] .findbar > * { +html[dir='ltr'] .findbar * { position: relative; float: left; } html[dir='rtl'] #toolbarViewerLeft > *, html[dir='rtl'] #toolbarViewerMiddle > *, html[dir='rtl'] #toolbarViewerRight > *, -html[dir='rtl'] .findbar > * { +html[dir='rtl'] .findbar * { position: relative; float: right; } @@ -752,10 +997,6 @@ html[dir='rtl'] .splitToolbarButton > .toolbarButton { opacity: .5; } -.toolbarButton.group { - margin-right: 0; -} - .splitToolbarButton.toggled .toolbarButton { margin: 0; } @@ -772,9 +1013,6 @@ html[dir='rtl'] .splitToolbarButton > .toolbarButton { box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset, 0 0 1px hsla(0,0%,100%,.15) inset, 0 1px 0 hsla(0,0%,100%,.05); - -webkit-transition-property: background-color, border-color, box-shadow; - -webkit-transition-duration: 150ms; - -webkit-transition-timing-function: ease; transition-property: background-color, border-color, box-shadow; transition-duration: 150ms; transition-timing-function: ease; @@ -834,9 +1072,6 @@ html[dir='rtl'] .splitToolbarButtonSeparator { padding: 12px 0; margin: 1px 0; box-shadow: 0 0 0 1px hsla(0,0%,100%,.03); - -webkit-transition-property: padding; - -webkit-transition-duration: 10ms; - -webkit-transition-timing-function: ease; transition-property: padding; transition-duration: 10ms; transition-timing-function: ease; @@ -854,13 +1089,11 @@ html[dir='rtl'] .splitToolbarButtonSeparator { font-size: 12px; line-height: 14px; -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; /* Opera does not support user-select, use <... unselectable="on"> instead */ cursor: default; - -webkit-transition-property: background-color, border-color, box-shadow; - -webkit-transition-duration: 150ms; - -webkit-transition-timing-function: ease; transition-property: background-color, border-color, box-shadow; transition-duration: 150ms; transition-timing-function: ease; @@ -903,9 +1136,6 @@ html[dir='rtl'] .dropdownToolbarButton { box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset, 0 0 1px hsla(0,0%,0%,.2) inset, 0 1px 0 hsla(0,0%,100%,.05); - -webkit-transition-property: background-color, border-color, box-shadow; - -webkit-transition-duration: 10ms; - -webkit-transition-timing-function: linear; transition-property: background-color, border-color, box-shadow; transition-duration: 10ms; transition-timing-function: linear; @@ -920,9 +1150,6 @@ html[dir='rtl'] .dropdownToolbarButton { box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset, 0 0 1px hsla(0,0%,0%,.2) inset, 0 1px 0 hsla(0,0%,100%,.05); - -webkit-transition-property: background-color, border-color, box-shadow; - -webkit-transition-duration: 10ms; - -webkit-transition-timing-function: linear; transition-property: background-color, border-color, box-shadow; transition-duration: 10ms; transition-timing-function: linear; @@ -993,12 +1220,6 @@ html[dir='rtl'] .toolbarButton:first-child { height: 1px; } -.toolbarButtonFlexibleSpacer { - -webkit-box-flex: 1; - -moz-box-flex: 1; - min-width: 30px; -} - html[dir='ltr'] #findPrevious { margin-left: 3px; } @@ -1102,8 +1323,6 @@ html[dir='rtl'] .toolbarButton.pageDown::before { .toolbarButton.bookmark, .secondaryToolbarButton.bookmark { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; outline: none; padding-top: 4px; @@ -1142,6 +1361,24 @@ html[dir="rtl"] #viewOutline.toolbarButton::before { content: url(images/toolbarButton-search.png); } +.toolbarButton.pdfSidebarNotification::after { + position: absolute; + display: inline-block; + top: 1px; + /* Create a filled circle, with a diameter of 9 pixels, using only CSS: */ + content: ''; + background-color: #70DB55; + height: 9px; + width: 9px; + border-radius: 50%; +} +html[dir='ltr'] .toolbarButton.pdfSidebarNotification::after { + left: 17px; +} +html[dir='rtl'] .toolbarButton.pdfSidebarNotification::after { + right: 17px; +} + .secondaryToolbarButton { position: relative; margin: 0 0 4px 0; @@ -1190,10 +1427,38 @@ html[dir="rtl"] .secondaryToolbarButton > span { content: url(images/secondaryToolbarButton-rotateCw.png); } +.secondaryToolbarButton.selectTool::before { + content: url(images/secondaryToolbarButton-selectTool.png); +} + .secondaryToolbarButton.handTool::before { content: url(images/secondaryToolbarButton-handTool.png); } +.secondaryToolbarButton.scrollVertical::before { + content: url(images/secondaryToolbarButton-scrollVertical.png); +} + +.secondaryToolbarButton.scrollHorizontal::before { + content: url(images/secondaryToolbarButton-scrollHorizontal.png); +} + +.secondaryToolbarButton.scrollWrapped::before { + content: url(images/secondaryToolbarButton-scrollWrapped.png); +} + +.secondaryToolbarButton.spreadNone::before { + content: url(images/secondaryToolbarButton-spreadNone.png); +} + +.secondaryToolbarButton.spreadOdd::before { + content: url(images/secondaryToolbarButton-spreadOdd.png); +} + +.secondaryToolbarButton.spreadEven::before { + content: url(images/secondaryToolbarButton-spreadEven.png); +} + .secondaryToolbarButton.documentProperties::before { content: url(images/secondaryToolbarButton-documentProperties.png); } @@ -1288,23 +1553,35 @@ html[dir='rtl'] .verticalToolbarSeparator { line-height: 14px; text-align: left; -webkit-user-select: none; - -moz-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; cursor: default; } #thumbnailView { position: absolute; - width: 120px; + width: calc(100% - 60px); top: 0; bottom: 0; - padding: 10px 40px 0; + padding: 10px 30px 0; overflow: auto; -webkit-overflow-scrolling: touch; } +#thumbnailView > a:active, +#thumbnailView > a:focus { + outline: 0; +} + .thumbnail { + margin: 0 10px 5px 10px; +} +html[dir='ltr'] .thumbnail { float: left; - margin-bottom: 5px; +} +html[dir='rtl'] .thumbnail { + float: right; } #thumbnailView > a:last-of-type > .thumbnail { @@ -1317,7 +1594,7 @@ html[dir='rtl'] .verticalToolbarSeparator { .thumbnail:not([data-loaded]) { border: 1px dashed rgba(255, 255, 255, 0.5); - margin: -1px -1px 4px -1px; + margin: -1px 9px 4px 9px; } .thumbnailImage { @@ -1368,13 +1645,15 @@ a:focus > .thumbnail > .thumbnailSelectionRing, #outlineView, #attachmentsView { position: absolute; - width: 192px; + width: calc(100% - 8px); top: 0; bottom: 0; overflow: auto; -webkit-overflow-scrolling: touch; -webkit-user-select: none; - -moz-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; } #outlineView { @@ -1407,7 +1686,10 @@ html[dir='rtl'] .outlineItem > .outlineItems { color: hsla(0,0%,100%,.8); font-size: 13px; line-height: 15px; - -moz-user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; white-space: normal; } @@ -1502,8 +1784,8 @@ html[dir='rtl'] .outlineItemToggler::before { /* TODO: file FF bug to support ::-moz-selection:window-inactive so we can override the opaque grey background when the window is inactive; see https://bugzilla.mozilla.org/show_bug.cgi?id=706209 */ -::selection { background: rgba(0,0,255,0.3); } ::-moz-selection { background: rgba(0,0,255,0.3); } +::selection { background: rgba(0,0,255,0.3); } #errorWrapper { background: none repeat scroll 0 0 #FF5555; @@ -1714,21 +1996,19 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { mix-blend-mode: screen; } -#viewer.textLayer-visible .textLayer > div { +#viewer.textLayer-visible .textLayer > span { background-color: rgba(255, 255, 0, 0.1); color: black; border: solid 1px rgba(255, 0, 0, 0.5); - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; } -#viewer.textLayer-hover .textLayer > div:hover { +#viewer.textLayer-hover .textLayer > span:hover { background-color: white; color: black; } -#viewer.textLayer-shadow .textLayer > div { +#viewer.textLayer-shadow .textLayer > span { background-color: rgba(255,255,255, .6); color: black; } @@ -1736,7 +2016,6 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { .grab-to-pan-grab { cursor: url("images/grab.cur"), move !important; cursor: -webkit-grab !important; - cursor: -moz-grab !important; cursor: grab !important; } .grab-to-pan-grab *:not(input):not(textarea):not(button):not(select):not(:link) { @@ -1746,7 +2025,6 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { .grab-to-pan-grabbing { cursor: url("images/grabbing.cur"), move !important; cursor: -webkit-grabbing !important; - cursor: -moz-grabbing !important; cursor: grabbing !important; position: fixed; @@ -1768,17 +2046,17 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { display: none; } -@media screen and (min-resolution: 2dppx) { +@media screen and (-webkit-min-device-pixel-ratio: 1.1), screen and (min-resolution: 1.1dppx) { /* Rules for Retina screens */ .toolbarButton::before { -webkit-transform: scale(0.5); - transform: scale(0.5); + transform: scale(0.5); top: -5px; } .secondaryToolbarButton::before { -webkit-transform: scale(0.5); - transform: scale(0.5); + transform: scale(0.5); top: -4px; } @@ -1915,17 +2193,45 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { content: url(images/secondaryToolbarButton-rotateCw@2x.png); } + .secondaryToolbarButton.selectTool::before { + content: url(images/secondaryToolbarButton-selectTool@2x.png); + } + .secondaryToolbarButton.handTool::before { content: url(images/secondaryToolbarButton-handTool@2x.png); } + .secondaryToolbarButton.scrollVertical::before { + content: url(images/secondaryToolbarButton-scrollVertical@2x.png); + } + + .secondaryToolbarButton.scrollHorizontal::before { + content: url(images/secondaryToolbarButton-scrollHorizontal@2x.png); + } + + .secondaryToolbarButton.scrollWrapped::before { + content: url(images/secondaryToolbarButton-scrollWrapped@2x.png); + } + + .secondaryToolbarButton.spreadNone::before { + content: url(images/secondaryToolbarButton-spreadNone@2x.png); + } + + .secondaryToolbarButton.spreadOdd::before { + content: url(images/secondaryToolbarButton-spreadOdd@2x.png); + } + + .secondaryToolbarButton.spreadEven::before { + content: url(images/secondaryToolbarButton-spreadEven@2x.png); + } + .secondaryToolbarButton.documentProperties::before { content: url(images/secondaryToolbarButton-documentProperties@2x.png); } .outlineItemToggler::before { -webkit-transform: scale(0.5); - transform: scale(0.5); + transform: scale(0.5); top: -1px; content: url(images/treeitem-expanded@2x.png); } @@ -1980,21 +2286,29 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { display: none; } - /* Rules for browsers that support mozPrintCallback */ - body[data-mozPrintCallback] #outerContainer { + /* Rules for browsers that support PDF.js printing */ + body[data-pdfjsprinting] #outerContainer { display: none; } - body[data-mozPrintCallback] #printContainer { + body[data-pdfjsprinting] #printContainer { display: block; } + #printContainer { + height: 100%; + } /* wrapper around (scaled) print canvas elements */ #printContainer > div { position: relative; top: 0; left: 0; - overflow: hidden; + width: 1px; + height: 1px; + overflow: visible; + page-break-after: always; + page-break-inside: avoid; } - #printContainer canvas { + #printContainer canvas, + #printContainer img { display: block; } } @@ -2005,64 +2319,27 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { display: none; } -@media all and (max-width: 960px) { - html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter, - html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter { - float: left; - left: 205px; - } - html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter, - html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter { - float: right; - right: 205px; - } -} - @media all and (max-width: 900px) { - .sidebarOpen .hiddenLargeView { - display: none; - } - .sidebarOpen .visibleLargeView { - display: inherit; - } -} - -@media all and (max-width: 860px) { - .sidebarOpen .hiddenMediumView { - display: none; - } - .sidebarOpen .visibleMediumView { - display: inherit; + #toolbarViewerMiddle { + display: table; + margin: auto; + left: auto; + position: inherit; + -webkit-transform: none; + transform: none; } } -@media all and (max-width: 770px) { - #sidebarContainer { - top: 32px; - z-index: 100; - } - .loadingInProgress #sidebarContainer { - top: 37px; - } +@media all and (max-width: 840px) { #sidebarContent { - top: 32px; background-color: hsla(0,0%,0%,.7); } - html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer { - left: 0px; + html[dir='ltr'] #outerContainer.sidebarOpen #viewerContainer { + left: 0px !important; } - html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer { - right: 0px; - } - - html[dir='ltr'] .outerCenter { - float: left; - left: 205px; - } - html[dir='rtl'] .outerCenter { - float: right; - right: 205px; + html[dir='rtl'] #outerContainer.sidebarOpen #viewerContainer { + right: 0px !important; } #outerContainer .hiddenLargeView, @@ -2075,7 +2352,7 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { } } -@media all and (max-width: 700px) { +@media all and (max-width: 770px) { #outerContainer .hiddenLargeView { display: none; } @@ -2084,7 +2361,7 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { } } -@media all and (max-width: 660px) { +@media all and (max-width: 700px) { #outerContainer .hiddenMediumView { display: none; } @@ -2093,30 +2370,26 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * { } } -@media all and (max-width: 600px) { - .hiddenSmallView { +@media all and (max-width: 640px) { + .hiddenSmallView, .hiddenSmallView * { display: none; } .visibleSmallView { display: inherit; } - html[dir='ltr'] #outerContainer.sidebarMoving .outerCenter, - html[dir='ltr'] #outerContainer.sidebarOpen .outerCenter, - html[dir='ltr'] .outerCenter { - left: 156px; - } - html[dir='rtl'] #outerContainer.sidebarMoving .outerCenter, - html[dir='rtl'] #outerContainer.sidebarOpen .outerCenter, - html[dir='rtl'] .outerCenter { - right: 156px; - } .toolbarButtonSpacer { width: 0; } + html[dir='ltr'] .findbar { + left: 38px; + } + html[dir='rtl'] .findbar { + right: 38px; + } } -@media all and (max-width: 510px) { - #scaleSelectContainer, #pageNumberLabel { +@media all and (max-width: 535px) { + #scaleSelectContainer { display: none; } } |