akira
/
pdfjs-dist
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fixing Chrome quirks

Artur Adib 13 years ago
parent
195efa404d
commit
d9db7af4c8
2 changed files with 53 additions and 2 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 52
      web/viewer.css
  2. 3
      web/viewer.html

52
web/viewer.css
Unescape View File

@ -17,6 +17,8 @@ body {
#outerContainer { #outerContainer {
display: -moz-box; display: -moz-box;
-moz-box-orient: horizontal; -moz-box-orient: horizontal;
display: -webkit-box;
-webkit-box-orient: horizontal;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
@ -34,6 +36,7 @@ body {
#viewerContainer { #viewerContainer {
-moz-box-flex: 1; -moz-box-flex: 1;
-webkit-box-flex: 1;
height: 100%; height: 100%;
box-shadow: inset 1px 0 0 hsla(0,0%,100%,.05); box-shadow: inset 1px 0 0 hsla(0,0%,100%,.05);
padding-top: 30px; padding-top: 30px;
@ -49,15 +52,19 @@ body {
#toolbarContainer { #toolbarContainer {
display: -moz-box; display: -moz-box;
display: -webkit-box;
width: 100%; width: 100%;
} }
#toolbarSidebar { #toolbarSidebar {
display: -moz-box; display: -moz-box;
display: -webkit-box;
width: 200px; width: 200px;
height: 32px; height: 32px;
background-image: url(images/texture.png), background-image: url(images/texture.png),
-moz-linear-gradient(hsla(0,0%,30%,.99), hsla(0,0%,25%,.95)); -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));
box-shadow: inset -2px 0 0 hsla(0,0%,100%,.08), box-shadow: inset -2px 0 0 hsla(0,0%,100%,.08),
inset 0 1px 1px hsla(0,0%,0%,.15), inset 0 1px 1px hsla(0,0%,0%,.15),
inset 0 -1px 0 hsla(0,0%,100%,.05), inset 0 -1px 0 hsla(0,0%,100%,.05),
@ -71,10 +78,14 @@ body {
#toolbarViewer { #toolbarViewer {
display: -moz-box; display: -moz-box;
-moz-box-flex: 1; -moz-box-flex: 1;
display: -webkit-box;
-webkit-box-flex: 1;
margin-left: -1px; margin-left: -1px;
height: 32px; height: 32px;
background-image: url(images/texture.png), background-image: url(images/texture.png),
-moz-linear-gradient(hsla(0,0%,32%,.99), hsla(0,0%,27%,.95)); -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));
border-left: 1px solid hsla(0,0%,0%,.5); border-left: 1px solid hsla(0,0%,0%,.5);
box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08), box-shadow: inset 1px 0 0 hsla(0,0%,100%,.08),
inset 0 1px 1px hsla(0,0%,0%,.15), inset 0 1px 1px hsla(0,0%,0%,.15),
@ -86,6 +97,7 @@ body {
.splitToolbarButton { .splitToolbarButton {
margin: 4px 2px 4px 0; margin: 4px 2px 4px 0;
display: -moz-box; display: -moz-box;
display: -webkit-box;
} }
.splitToolbarButton > .toolbarButton { .splitToolbarButton > .toolbarButton {
position: relative; position: relative;
@ -93,10 +105,18 @@ body {
padding: 3px 6px; padding: 3px 6px;
border-radius: 0; border-radius: 0;
} }
.toolbarButton {
margin: 4px 2px 4px 0;
display: -moz-box;
display: -webkit-box;
}
.splitToolbarButton:hover > .toolbarButton, .splitToolbarButton:hover > .toolbarButton,
.splitToolbarButton.toggled > .toolbarButton { .splitToolbarButton.toggled > .toolbarButton {
background-color: hsla(0,0%,0%,.12); background-color: hsla(0,0%,0%,.12);
background-image: -moz-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: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
background-clip: padding-box; background-clip: padding-box;
border: 1px solid hsla(0,0%,0%,.35); 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); border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
@ -106,6 +126,9 @@ body {
-moz-transition-property: background-color, border-color, box-shadow; -moz-transition-property: background-color, border-color, box-shadow;
-moz-transition-duration: 150ms; -moz-transition-duration: 150ms;
-moz-transition-timing-function: ease; -moz-transition-timing-function: ease;
-webkit-transition-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 150ms;
-webkit-transition-timing-function: ease;
} }
.splitToolbarButton > .toolbarButton:hover, .splitToolbarButton > .toolbarButton:hover,
.dropdownToolbarButton:hover { .dropdownToolbarButton:hover {
@ -145,11 +168,15 @@ body {
-moz-transition-property: margin; -moz-transition-property: margin;
-moz-transition-duration: 10ms; -moz-transition-duration: 10ms;
-moz-transition-timing-function: ease; -moz-transition-timing-function: ease;
-webkit-transition-property: margin;
-webkit-transition-duration: 10ms;
-webkit-transition-timing-function: ease;
} }
.toolbarButton, .toolbarButton,
.dropdownToolbarButton { .dropdownToolbarButton {
-moz-box-flex: 0; -moz-box-flex: 0;
-webkit-box-flex: 1;
min-width: 16px; min-width: 16px;
padding: 3px 7px; padding: 3px 7px;
margin: 4px 2px 4px 0; margin: 4px 2px 4px 0;
@ -159,16 +186,21 @@ body {
font-size: 12px; font-size: 12px;
line-height: 14px; line-height: 14px;
-moz-user-select:none; -moz-user-select:none;
-webkit-user-select:none;
cursor: default; cursor: default;
-moz-transition-property: background-color, border-color, box-shadow; -moz-transition-property: background-color, border-color, box-shadow;
-moz-transition-duration: 150ms; -moz-transition-duration: 150ms;
-moz-transition-timing-function: ease; -moz-transition-timing-function: ease;
-webkit-transition-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 150ms;
-webkit-transition-timing-function: ease;
} }
.toolbarButton:hover, .toolbarButton:hover,
.dropdownToolbarButton { .dropdownToolbarButton {
background-color: hsla(0,0%,0%,.12); background-color: hsla(0,0%,0%,.12);
background-image: -moz-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: -webkit-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0));
background-clip: padding-box; background-clip: padding-box;
border: 1px solid hsla(0,0%,0%,.35); 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); border-color: hsla(0,0%,0%,.32) hsla(0,0%,0%,.38) hsla(0,0%,0%,.42);
@ -181,6 +213,7 @@ body {
.dropdownToolbarButton:hover:active { .dropdownToolbarButton:hover:active {
background-color: hsla(0,0%,0%,.2); background-color: hsla(0,0%,0%,.2);
background-image: -moz-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: -webkit-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); 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, box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset,
0 0 1px hsla(0,0%,0%,.2) inset, 0 0 1px hsla(0,0%,0%,.2) inset,
@ -188,12 +221,16 @@ body {
-moz-transition-property: background-color, border-color, box-shadow; -moz-transition-property: background-color, border-color, box-shadow;
-moz-transition-duration: 10ms; -moz-transition-duration: 10ms;
-moz-transition-timing-function: linear; -moz-transition-timing-function: linear;
-webkit-transition-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 10ms;
-webkit-transition-timing-function: linear;
} }
.toolbarButton.toggled, .toolbarButton.toggled,
.splitToolbarButton.toggled > .toolbarButton.toggled { .splitToolbarButton.toggled > .toolbarButton.toggled {
background-color: hsla(0,0%,0%,.3); background-color: hsla(0,0%,0%,.3);
background-image: -moz-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: -webkit-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); 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, box-shadow: 0 1px 1px hsla(0,0%,0%,.1) inset,
0 0 1px hsla(0,0%,0%,.2) inset, 0 0 1px hsla(0,0%,0%,.2) inset,
@ -201,6 +238,9 @@ body {
-moz-transition-property: background-color, border-color, box-shadow; -moz-transition-property: background-color, border-color, box-shadow;
-moz-transition-duration: 10ms; -moz-transition-duration: 10ms;
-moz-transition-timing-function: linear; -moz-transition-timing-function: linear;
-webkit-transition-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 10ms;
-webkit-transition-timing-function: linear;
} }
.toolbarButton.toggled:hover:active, .toolbarButton.toggled:hover:active,
@ -219,7 +259,9 @@ body {
background: url(images/toolbarButton-menuArrows.png) no-repeat 95%; background: url(images/toolbarButton-menuArrows.png) no-repeat 95%;
} }
.dropdownToolbarButton select { .dropdownToolbarButton > select {
-moz-appearance: none; /* in the future this might matter, see bugzilla bug #649849 */
-webkit-appearance: none;
min-width: 120px; min-width: 120px;
font-size: 12px; font-size: 12px;
color: hsl(0,0%,95%); color: hsl(0,0%,95%);
@ -244,6 +286,7 @@ body {
.toolbarButtonFlexibleSpacer { .toolbarButtonFlexibleSpacer {
-moz-box-flex: 1; -moz-box-flex: 1;
-webkit-box-flex: 1;
min-width: 30px; min-width: 30px;
} }
@ -346,6 +389,7 @@ body {
line-height: 14px; line-height: 14px;
text-align: left; text-align: left;
-moz-user-select:none; -moz-user-select:none;
-webkit-user-select:none;
cursor: default; cursor: default;
} }
@ -417,6 +461,7 @@ body {
padding: 16px 4px 0; padding: 16px 4px 0;
overflow: auto; overflow: auto;
-moz-user-select:none; -moz-user-select:none;
-webkit-user-select:none;
} }
#outlineView.hidden { #outlineView.hidden {
display:none; display:none;
@ -633,3 +678,8 @@ canvas {
.clearBoth { .clearBoth {
clear: both; clear: both;
} }
.fileInput {
background: white;
color: black;
}

3
web/viewer.html
Unescape View File

@ -81,12 +81,13 @@
</div> </div>
<div class="toolbarButtonFlexibleSpacer"></div> <div class="toolbarButtonFlexibleSpacer"></div>
<input id="fileInput" class="toolbarButton fileInput" type="file" oncontextmenu="return false;"/> <input id="fileInput" class="toolbarButton fileInput" type="file" oncontextmenu="return false;"/>
<div class="toolbarButtonSpacer"></div> <div class="toolbarButtonSpacer"></div>
<!-- <div class="toolbarButton print" title="Print"></div> --> <!-- <div class="toolbarButton print" title="Print"></div> -->
<div class="toolbarButton download" title="Download" onclick="PDFView.download();"></div> <div id="download" class="toolbarButton download" title="Download" onclick="PDFView.download();"></div>
<a href="#" id="viewBookmark" class="toolbarButton bookmark" title="Bookmark (or copy) current location"> <a href="#" id="viewBookmark" class="toolbarButton bookmark" title="Bookmark (or copy) current location">
</a> </a>
</div> </div>

Write Preview
Loading…
Cancel
Save