Sakurai/pdf.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added missing css vendor prefixes and reordered some properties according to cascade

Browse Source
This commit is contained in:
Steffen Märcker 2012-06-11 11:03:15 +02:00
parent 2aae4fd001
commit 3b14930eec
1 changed files with 141 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

186
web/viewer.css
View File

@ -54,19 +54,31 @@ html[dir='rtl'] .innerCenter {
bottom: 0; bottom: 0;
width: 200px; width: 200px;
visibility: hidden; visibility: hidden;
-moz-transition-duration: 200ms;
-moz-transition-timing-function: ease;
-webkit-transition-duration: 200ms; -webkit-transition-duration: 200ms;
-webkit-transition-timing-function: ease; -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 { html[dir='ltr'] #sidebarContainer {
-moz-transition-property: left;
-webkit-transition-property: left; -webkit-transition-property: left;
-moz-transition-property: left;
-ms-transition-property: left;
-o-transition-property: left;
transition-property: left;
left: -200px; left: -200px;
} }
html[dir='rtl'] #sidebarContainer { html[dir='rtl'] #sidebarContainer {
-moz-transition-property: right;
-webkit-transition-property: right; -webkit-transition-property: right;
-ms-transition-property: right;
-o-transition-property: right;
transition-property: right;
right: -200px; right: -200px;
} }
@ -87,19 +99,31 @@ html[dir='rtl'] #outerContainer.sidebarOpen > #sidebarContainer {
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
-moz-transition-duration: 200ms;
-moz-transition-timing-function: ease;
-webkit-transition-duration: 200ms; -webkit-transition-duration: 200ms;
-webkit-transition-timing-function: ease; -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 { html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
-moz-transition-property: left;
-webkit-transition-property: left; -webkit-transition-property: left;
-moz-transition-property: left;
-ms-transition-property: left;
-o-transition-property: left;
transition-property: left;
left: 200px; left: 200px;
} }
html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer { html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
-moz-transition-property: right;
-webkit-transition-property: right; -webkit-transition-property: right;
-moz-transition-property: right;
-ms-transition-property: right;
-o-transition-property: right;
transition-property: right;
right: 200px; right: 200px;
} }
@ -147,10 +171,16 @@ html[dir='rtl'] #sidebarContent {
#toolbarSidebar { #toolbarSidebar {
width: 200px; width: 200px;
height: 32px; height: 32px;
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), 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), 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), 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),
@ -161,10 +191,16 @@ html[dir='rtl'] #sidebarContent {
#toolbarViewer { #toolbarViewer {
position: relative; position: relative;
height: 32px; 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), 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), 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); 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),
@ -246,20 +282,33 @@ html[dir='rtl'] .splitToolbarButton > .toolbarButton {
.splitToolbarButton:focus > .toolbarButton, .splitToolbarButton:focus > .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: -webkit-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; 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);
box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset, box-shadow: 0 1px 0 hsla(0,0%,100%,.05) inset,
0 0 1px hsla(0,0%,100%,.15) inset, 0 0 1px hsla(0,0%,100%,.15) inset,
0 1px 0 hsla(0,0%,100%,.05); 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-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 150ms; -webkit-transition-duration: 150ms;
-webkit-transition-timing-function: ease; -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:hover,
.splitToolbarButton > .toolbarButton:focus, .splitToolbarButton > .toolbarButton:focus,
@ -308,12 +357,21 @@ html[dir='rtl'] .splitToolbarButtonSeparator {
padding: 12px 0; padding: 12px 0;
margin: 0; margin: 0;
box-shadow: 0 0 0 1px hsla(0,0%,100%,.03); 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-property: padding;
-webkit-transition-duration: 10ms; -webkit-transition-duration: 10ms;
-webkit-transition-timing-function: ease; -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, .toolbarButton,
@ -325,15 +383,26 @@ html[dir='rtl'] .splitToolbarButtonSeparator {
color: hsl(0,0%,95%); color: hsl(0,0%,95%);
font-size: 12px; font-size: 12px;
line-height: 14px; line-height: 14px;
-moz-user-select:none;
-webkit-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; 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-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 150ms; -webkit-transition-duration: 150ms;
-webkit-transition-timing-function: ease; -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, html[dir='ltr'] .toolbarButton,
@ -349,8 +418,11 @@ html[dir='rtl'] .dropdownToolbarButton {
.toolbarButton:focus, .toolbarButton:focus,
.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: -webkit-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; 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);
@ -362,35 +434,59 @@ html[dir='rtl'] .dropdownToolbarButton {
.toolbarButton:hover:active, .toolbarButton:hover:active,
.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: -webkit-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); 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,
0 1px 0 hsla(0,0%,100%,.05); 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-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 10ms; -webkit-transition-duration: 10ms;
-webkit-transition-timing-function: linear; -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, .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: -webkit-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); 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,
0 1px 0 hsla(0,0%,100%,.05); 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-property: background-color, border-color, box-shadow;
-webkit-transition-duration: 10ms; -webkit-transition-duration: 10ms;
-webkit-transition-timing-function: linear; -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, .toolbarButton.toggled:hover:active,
@ -417,8 +513,8 @@ html[dir='rtl'] .dropdownToolbarButton {
} }
.dropdownToolbarButton > select { .dropdownToolbarButton > select {
-moz-appearance: none; /* in the future this might matter, see bugzilla bug #649849 */
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; /* in the future this might matter, see bugzilla bug #649849 */
min-width: 140px; min-width: 140px;
font-size: 12px; font-size: 12px;
color: hsl(0,0%,95%); color: hsl(0,0%,95%);
@ -460,8 +556,8 @@ html[dir='rtl'] .toolbarButton:first-child {
} }
.toolbarButtonFlexibleSpacer { .toolbarButtonFlexibleSpacer {
-moz-box-flex: 1;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-moz-box-flex: 1;
min-width: 30px; min-width: 30px;
} }
@ -516,8 +612,8 @@ html[dir='rtl'] .toolbarButton.pageDown::before {
} }
.toolbarButton.bookmark { .toolbarButton.bookmark {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
margin-top: 3px; margin-top: 3px;
padding-top: 4px; padding-top: 4px;
@ -597,8 +693,8 @@ html[dir='rtl'] .toolbarButton.pageDown::before {
font-size: 12px; font-size: 12px;
line-height: 14px; line-height: 14px;
text-align: left; text-align: left;
-moz-user-select:none;
-webkit-user-select:none; -webkit-user-select:none;
-moz-user-select:none;
cursor: default; cursor: default;
} }
@ -674,8 +770,8 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
bottom: 0; bottom: 0;
padding: 4px 4px 0; padding: 4px 4px 0;
overflow: auto; overflow: auto;
-moz-user-select:none;
-webkit-user-select:none; -webkit-user-select:none;
-moz-user-select:none;
} }
.outlineItem > .outlineItems { .outlineItem > .outlineItems {
@ -784,9 +880,9 @@ canvas {
margin: 10px auto; margin: 10px auto;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
box-shadow: 0px 4px 10px #000;
-moz-box-shadow: 0px 4px 10px #000;
-webkit-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; background-color: white;
} }
@ -798,9 +894,9 @@ canvas {
.page > a:hover { .page > a:hover {
opacity: 0.2; opacity: 0.2;
background: #ff0; background: #ff0;
box-shadow: 0px 2px 10px #ff0;
-moz-box-shadow: 0px 2px 10px #ff0;
-webkit-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 { .loadingIcon {
@ -838,11 +934,11 @@ canvas {
float: left; float: left;
background: #666; background: #666;
background: -moz-linear-gradient(top, #999 0%, #666 50%, #999 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999), color-stop(50%,#666), color-stop(100%,#999)); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999), color-stop(50%,#666), color-stop(100%,#999));
background: -webkit-linear-gradient(top, #999 0%,#666 50%,#999 100%); background: -webkit-linear-gradient(top, #999 0%,#666 50%,#999 100%);
background: -o-linear-gradient(top, #999 0%,#666 50%,#999 100%); background: -moz-linear-gradient(top, #999 0%, #666 50%, #999 100%);
background: -ms-linear-gradient(top, #999 0%,#666 50%,#999 100%); background: -ms-linear-gradient(top, #999 0%,#666 50%,#999 100%);
background: -o-linear-gradient(top, #999 0%,#666 50%,#999 100%);
background: linear-gradient(top, #999 0%,#666 50%,#999 100%); background: linear-gradient(top, #999 0%,#666 50%,#999 100%);
border-top-left-radius: 3px; border-top-left-radius: 3px;
@ -896,9 +992,9 @@ canvas {
padding: 0.2em; padding: 0.2em;
max-width: 20em; max-width: 20em;
background-color: #F1E47B; background-color: #F1E47B;
box-shadow: 0px 2px 10px #333;
-moz-box-shadow: 0px 2px 10px #333;
-webkit-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 { .annotComment > div > h1 {
@ -1008,9 +1104,9 @@ canvas {
.page { .page {
float: left; float: left;
display: none; display: none;
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none; -webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
} }
.page[data-loaded] { .page[data-loaded] {