mirror of
https://github.com/mozilla/pdf.js.git
synced 2025-04-20 15:18:08 +02:00
Merge upstream.
This commit is contained in:
Brendan Dahl
commit
8b0fd2a8f9
8 changed files with 268 additions and 66 deletions
197
web/viewer.css
197
web/viewer.css
|
|
@ -11,7 +11,13 @@ body {
|
|||
height: 100%;
|
||||
background-color: #404040;
|
||||
background-image: url(images/texture.png);
|
||||
font-family: Segoe UI, Verdana, sans-serif;
|
||||
}
|
||||
|
||||
body,
|
||||
input,
|
||||
button,
|
||||
select {
|
||||
font: message-box;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
|
|
@ -54,19 +60,31 @@ html[dir='rtl'] .innerCenter {
|
|||
bottom: 0;
|
||||
width: 200px;
|
||||
visibility: hidden;
|
||||
-moz-transition-duration: 200ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-webkit-transition-duration: 200ms;
|
||||
-webkit-transition-timing-function: ease;
|
||||
-moz-transition-duration: 200ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-ms-transition-duration: 200ms;
|
||||
-ms-transition-timing-function: ease;
|
||||
-o-transition-duration: 200ms;
|
||||
-o-transition-timing-function: ease;
|
||||
transition-duration: 200ms;
|
||||
transition-timing-function: ease;
|
||||
|
||||
}
|
||||
html[dir='ltr'] #sidebarContainer {
|
||||
-moz-transition-property: left;
|
||||
-webkit-transition-property: left;
|
||||
-moz-transition-property: left;
|
||||
-ms-transition-property: left;
|
||||
-o-transition-property: left;
|
||||
transition-property: left;
|
||||
left: -200px;
|
||||
}
|
||||
html[dir='rtl'] #sidebarContainer {
|
||||
-moz-transition-property: right;
|
||||
-webkit-transition-property: right;
|
||||
-ms-transition-property: right;
|
||||
-o-transition-property: right;
|
||||
transition-property: right;
|
||||
right: -200px;
|
||||
}
|
||||
|
||||
|
|
@ -87,19 +105,31 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer {
|
|||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
-moz-transition-duration: 200ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-webkit-transition-duration: 200ms;
|
||||
-webkit-transition-timing-function: ease;
|
||||
-moz-transition-duration: 200ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-ms-transition-duration: 200ms;
|
||||
-ms-transition-timing-function: ease;
|
||||
-o-transition-duration: 200ms;
|
||||
-o-transition-timing-function: ease;
|
||||
transition-duration: 200ms;
|
||||
transition-timing-function: ease;
|
||||
}
|
||||
html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
|
||||
-moz-transition-property: left;
|
||||
-webkit-transition-property: left;
|
||||
-moz-transition-property: left;
|
||||
-ms-transition-property: left;
|
||||
-o-transition-property: left;
|
||||
transition-property: left;
|
||||
left: 200px;
|
||||
}
|
||||
html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
|
||||
-moz-transition-property: right;
|
||||
-webkit-transition-property: right;
|
||||
-moz-transition-property: right;
|
||||
-ms-transition-property: right;
|
||||
-o-transition-property: right;
|
||||
transition-property: right;
|
||||
right: 200px;
|
||||
}
|
||||
|
||||
|
|
@ -147,10 +177,16 @@ html[dir='rtl'] #sidebarContent {
|
|||
#toolbarSidebar {
|
||||
width: 200px;
|
||||
height: 29px;
|
||||
background-image: url(images/texture.png),
|
||||
-webkit-linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
-moz-linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
-webkit-linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
|
||||
-ms-linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
-o-linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95));
|
||||
box-shadow: inset -2px 0 0 hsla(0,0%,100%,.08),
|
||||
inset 0 1px 1px hsla(0,0%,0%,.15),
|
||||
inset 0 -1px 0 hsla(0,0%,100%,.05),
|
||||
|
|
@ -161,10 +197,16 @@ html[dir='rtl'] #sidebarContent {
|
|||
#toolbarViewer {
|
||||
position: relative;
|
||||
height: 32px;
|
||||
background-image: url(images/texture.png),
|
||||
-webkit-linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
-moz-linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
-webkit-linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
|
||||
-ms-linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
-o-linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
|
||||
background-image: url(images/texture.png),
|
||||
linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95));
|
||||
border-left: 1px solid hsla(0,0%,0%,.5);
|
||||
box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08),
|
||||
inset 0 1px 1px hsla(0,0%,0%,.15),
|
||||
|
|
@ -251,20 +293,33 @@ html[dir='rtl'] .splitToolbarButton > .toolbarButton {
|
|||
.splitToolbarButton.toggled > .toolbarButton,
|
||||
.toolbarButton.textButton {
|
||||
background-color: hsla(0,0%,0%,.12);
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -ms-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -o-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-clip: padding-box;
|
||||
border: 1px solid hsla(0,0%,0%,.35);
|
||||
border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
|
||||
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);
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 150ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-webkit-transition-property: background-color, border-color, box-shadow;
|
||||
-webkit-transition-duration: 150ms;
|
||||
-webkit-transition-timing-function: ease;
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 150ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-ms-transition-property: background-color, border-color, box-shadow;
|
||||
-ms-transition-duration: 150ms;
|
||||
-ms-transition-timing-function: ease;
|
||||
-o-transition-property: background-color, border-color, box-shadow;
|
||||
-o-transition-duration: 150ms;
|
||||
-o-transition-timing-function: ease;
|
||||
transition-property: background-color, border-color, box-shadow;
|
||||
transition-duration: 150ms;
|
||||
transition-timing-function: ease;
|
||||
|
||||
}
|
||||
.splitToolbarButton > .toolbarButton:hover,
|
||||
.splitToolbarButton > .toolbarButton:focus,
|
||||
|
|
@ -315,12 +370,21 @@ html[dir='rtl'] .splitToolbarButtonSeparator {
|
|||
padding: 12px 0;
|
||||
margin: 0;
|
||||
box-shadow: 0 0 0 1px hsla(0,0%,100%,.03);
|
||||
-moz-transition-property: padding;
|
||||
-moz-transition-duration: 10ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-webkit-transition-property: padding;
|
||||
-webkit-transition-duration: 10ms;
|
||||
-webkit-transition-timing-function: ease;
|
||||
-moz-transition-property: padding;
|
||||
-moz-transition-duration: 10ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-ms-transition-property: padding;
|
||||
-ms-transition-duration: 10ms;
|
||||
-ms-transition-timing-function: ease;
|
||||
-o-transition-property: padding;
|
||||
-o-transition-duration: 10ms;
|
||||
-o-transition-timing-function: ease;
|
||||
transition-property: padding;
|
||||
transition-duration: 10ms;
|
||||
transition-timing-function: ease;
|
||||
}
|
||||
|
||||
.toolbarButton,
|
||||
|
|
@ -332,15 +396,26 @@ html[dir='rtl'] .splitToolbarButtonSeparator {
|
|||
color: hsl(0,0%,95%);
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
-moz-user-select:none;
|
||||
-webkit-user-select:none;
|
||||
-moz-user-select:none;
|
||||
-ms-user-select:none;
|
||||
/* Opera does not support user-select, use <... unselectable="on"> instead */
|
||||
cursor: default;
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 150ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-webkit-transition-property: background-color, border-color, box-shadow;
|
||||
-webkit-transition-duration: 150ms;
|
||||
-webkit-transition-timing-function: ease;
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 150ms;
|
||||
-moz-transition-timing-function: ease;
|
||||
-ms-transition-property: background-color, border-color, box-shadow;
|
||||
-ms-transition-duration: 150ms;
|
||||
-ms-transition-timing-function: ease;
|
||||
-o-transition-property: background-color, border-color, box-shadow;
|
||||
-o-transition-duration: 150ms;
|
||||
-o-transition-timing-function: ease;
|
||||
transition-property: background-color, border-color, box-shadow;
|
||||
transition-duration: 150ms;
|
||||
transition-timing-function: ease;
|
||||
}
|
||||
|
||||
html[dir='ltr'] .toolbarButton,
|
||||
|
|
@ -356,8 +431,11 @@ html[dir='rtl'] .dropdownToolbarButton {
|
|||
.toolbarButton:focus,
|
||||
.dropdownToolbarButton {
|
||||
background-color: hsla(0,0%,0%,.12);
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -ms-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -o-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-clip: padding-box;
|
||||
border: 1px solid hsla(0,0%,0%,.35);
|
||||
border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
|
||||
|
|
@ -369,35 +447,59 @@ html[dir='rtl'] .dropdownToolbarButton {
|
|||
.toolbarButton:hover:active,
|
||||
.dropdownToolbarButton:hover:active {
|
||||
background-color: hsla(0,0%,0%,.2);
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -ms-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -o-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
border-color: hsla(0,0%,0%,.35) hsla(0,0%,0%,.4) hsla(0,0%,0%,.45);
|
||||
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);
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 10ms;
|
||||
-moz-transition-timing-function: linear;
|
||||
-webkit-transition-property: background-color, border-color, box-shadow;
|
||||
-webkit-transition-duration: 10ms;
|
||||
-webkit-transition-timing-function: linear;
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 10ms;
|
||||
-moz-transition-timing-function: linear;
|
||||
-ms-transition-property: background-color, border-color, box-shadow;
|
||||
-ms-transition-duration: 10ms;
|
||||
-ms-transition-timing-function: linear;
|
||||
-o-transition-property: background-color, border-color, box-shadow;
|
||||
-o-transition-duration: 10ms;
|
||||
-o-transition-timing-function: linear;
|
||||
transition-property: background-color, border-color, box-shadow;
|
||||
transition-duration: 10ms;
|
||||
transition-timing-function: linear;
|
||||
}
|
||||
|
||||
.toolbarButton.toggled,
|
||||
.splitToolbarButton.toggled > .toolbarButton.toggled {
|
||||
background-color: hsla(0,0%,0%,.3);
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -ms-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: -o-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
background-image: linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
|
||||
border-color: hsla(0,0%,0%,.4) hsla(0,0%,0%,.45) hsla(0,0%,0%,.5);
|
||||
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);
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 10ms;
|
||||
-moz-transition-timing-function: linear;
|
||||
-webkit-transition-property: background-color, border-color, box-shadow;
|
||||
-webkit-transition-duration: 10ms;
|
||||
-webkit-transition-timing-function: linear;
|
||||
-moz-transition-property: background-color, border-color, box-shadow;
|
||||
-moz-transition-duration: 10ms;
|
||||
-moz-transition-timing-function: linear;
|
||||
-ms-transition-property: background-color, border-color, box-shadow;
|
||||
-ms-transition-duration: 10ms;
|
||||
-ms-transition-timing-function: linear;
|
||||
-o-transition-property: background-color, border-color, box-shadow;
|
||||
-o-transition-duration: 10ms;
|
||||
-o-transition-timing-function: linear;
|
||||
transition-property: background-color, border-color, box-shadow;
|
||||
transition-duration: 10ms;
|
||||
transition-timing-function: linear;
|
||||
}
|
||||
|
||||
.toolbarButton.toggled:hover:active,
|
||||
|
|
@ -424,8 +526,8 @@ html[dir='rtl'] .dropdownToolbarButton {
|
|||
}
|
||||
|
||||
.dropdownToolbarButton > select {
|
||||
-moz-appearance: none; /* in the future this might matter, see bugzilla bug #649849 */
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none; /* in the future this might matter, see bugzilla bug #649849 */
|
||||
min-width: 140px;
|
||||
font-size: 12px;
|
||||
color: hsl(0,0%,95%);
|
||||
|
|
@ -467,8 +569,8 @@ html[dir='rtl'] .toolbarButton:first-child {
|
|||
}
|
||||
|
||||
.toolbarButtonFlexibleSpacer {
|
||||
-moz-box-flex: 1;
|
||||
-webkit-box-flex: 1;
|
||||
-moz-box-flex: 1;
|
||||
min-width: 30px;
|
||||
}
|
||||
|
||||
|
|
@ -523,8 +625,8 @@ html[dir='rtl'] .toolbarButton.pageDown::before {
|
|||
}
|
||||
|
||||
.toolbarButton.bookmark {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin-top: 3px;
|
||||
padding-top: 4px;
|
||||
|
|
@ -603,8 +705,8 @@ html[dir='rtl'] .toolbarButton.pageDown::before {
|
|||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
text-align: left;
|
||||
-moz-user-select:none;
|
||||
-webkit-user-select:none;
|
||||
-moz-user-select:none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
|
|
@ -680,8 +782,8 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
|
|||
bottom: 0;
|
||||
padding: 4px 4px 0;
|
||||
overflow: auto;
|
||||
-moz-user-select:none;
|
||||
-webkit-user-select:none;
|
||||
-moz-user-select:none;
|
||||
}
|
||||
|
||||
.outlineItem > .outlineItems {
|
||||
|
|
@ -791,9 +893,9 @@ canvas {
|
|||
margin: 10px auto;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
box-shadow: 0px 4px 10px #000;
|
||||
-moz-box-shadow: 0px 4px 10px #000;
|
||||
-webkit-box-shadow: 0px 4px 10px #000;
|
||||
-moz-box-shadow: 0px 4px 10px #000;
|
||||
box-shadow: 0px 4px 10px #000;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
|
|
@ -805,9 +907,9 @@ canvas {
|
|||
.page > a:hover {
|
||||
opacity: 0.2;
|
||||
background: #ff0;
|
||||
box-shadow: 0px 2px 10px #ff0;
|
||||
-moz-box-shadow: 0px 2px 10px #ff0;
|
||||
-webkit-box-shadow: 0px 2px 10px #ff0;
|
||||
-moz-box-shadow: 0px 2px 10px #ff0;
|
||||
box-shadow: 0px 2px 10px #ff0;
|
||||
}
|
||||
|
||||
.loadingIcon {
|
||||
|
|
@ -855,12 +957,13 @@ canvas {
|
|||
float: left;
|
||||
|
||||
background: #666;
|
||||
background: -moz-linear-gradient(top, #b2b2b2 0%, #898989 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2b2b2), color-stop(100%,#898989));
|
||||
background: -webkit-linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
background: -o-linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
background: -moz-linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
background: -ms-linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
background: linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
background: -o-linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
background: linear-gradient(top, #b2b2b2 0%,#898989 100%);
|
||||
|
||||
border-top-left-radius: 2px;
|
||||
border-bottom-left-radius: 2px;
|
||||
|
||||
|
|
@ -912,9 +1015,9 @@ canvas {
|
|||
padding: 0.2em;
|
||||
max-width: 20em;
|
||||
background-color: #F1E47B;
|
||||
box-shadow: 0px 2px 10px #333;
|
||||
-moz-box-shadow: 0px 2px 10px #333;
|
||||
-webkit-box-shadow: 0px 2px 10px #333;
|
||||
-moz-box-shadow: 0px 2px 10px #333;
|
||||
box-shadow: 0px 2px 10px #333;
|
||||
}
|
||||
|
||||
.annotComment > div > h1 {
|
||||
|
|
@ -1024,9 +1127,9 @@ canvas {
|
|||
.page {
|
||||
float: left;
|
||||
display: none;
|
||||
box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.page[data-loaded] {
|
||||
|
|
|
|||
|
|
@ -1846,6 +1846,18 @@ window.addEventListener('pagechange', function pagechange(evt) {
|
|||
document.getElementById('next').disabled = (page >= PDFView.pages.length);
|
||||
}, true);
|
||||
|
||||
// Firefox specific event, so that we can prevent browser from zooming
|
||||
window.addEventListener('DOMMouseScroll', function(evt) {
|
||||
if (evt.ctrlKey) {
|
||||
evt.preventDefault();
|
||||
|
||||
var ticks = evt.detail;
|
||||
var direction = (ticks > 0) ? 'zoomOut' : 'zoomIn';
|
||||
for (var i = 0, length = Math.abs(ticks); i < length; i++)
|
||||
PDFView[direction]();
|
||||
}
|
||||
}, false);
|
||||
|
||||
window.addEventListener('keydown', function keydown(evt) {
|
||||
var handled = false;
|
||||
var cmd = (evt.ctrlKey ? 1 : 0) |
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue