Commit a907a715 by xiaowenfeng

新增翻页,选择缩放功能,

parent 496ca9d8
Showing with 2356 additions and 144 deletions
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html dir="ltr" lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
......
<template> <template>
<div id="app"> <div id="app">
<div id="toolbar"> <div class="toolbar">
<span> <div id="toolbarContainer">
<button class="toolbarButton zoomin" @click="zoomin"></button> <div id="toolbarViewer">
<button class="toolbarButton zoomout" @click="zoomout"></button> <div id="toolbarViewerLeft">
</span> <div class="splitToolbarButton hiddenSmallView">
<span> <button
<span class="pageNumber currentIndex">1</span> :class="[
<span class="pageNumber">/ 99</span> 'toolbarButton',
</span> 'pageUp',
<span> pageIndex === 1 ? 'taoolbarCantUse' : ''
<button class="toolbarButton pageUp"></button> ]"
<button class="toolbarButton pageDown"></button> title="Previous Page"
</span> id="previous"
tabindex="13"
data-l10n-id="previous"
@click="previous"
>
<span data-l10n-id="previous_label">上一页</span>
</button>
<div class="splitToolbarButtonSeparator"></div>
<button
:class="[
'toolbarButton',
'pageDown',
pageIndex === pageLength ? 'taoolbarCantUse' : ''
]"
title="Next Page"
id="next"
tabindex="14"
data-l10n-id="next"
@click="next"
>
<span data-l10n-id="next_label">下一页</span>
</button>
</div>
<input
type="number"
id="pageNumber"
class="toolbarField pageNumber"
title="Page"
v-model="pageIndex"
size="4"
min="1"
tabindex="15"
data-l10n-id="page"
autocomplete="off"
disabled="disabled"
/>
<span id="numPages" class="toolbarLabel">/ {{ pageLength }}</span>
</div>
<div id="toolbarViewerMiddle">
<div class="splitToolbarButton">
<button
id="zoomOut"
class="toolbarButton zoomOut"
title="Zoom Out"
tabindex="21"
data-l10n-id="zoom_out"
@click="zoomOut"
>
<span data-l10n-id="zoom_out_label">放大</span>
</button>
<div class="splitToolbarButtonSeparator"></div>
<button
id="zoomIn"
class="toolbarButton zoomIn"
title="Zoom In"
tabindex="22"
data-l10n-id="zoom_in"
@click="zoomIn"
>
<span data-l10n-id="zoom_in_label">缩小</span>
</button>
</div>
<span id="scaleSelectContainer" class="dropdownToolbarButton">
<select
id="scaleSelect"
title="Zoom"
tabindex="23"
data-l10n-id="zoom"
v-model="selected"
@change="changeSelected(selected)"
>
<option
id="pageAutoOption"
title=""
value="auto"
selected="selected"
data-l10n-id="page_scale_auto"
>自动缩放</option
>
<option
id="pageActualOption"
title=""
value="page-actual"
data-l10n-id="page_scale_actual"
>实际大小</option
>
<option
id="pageFitOption"
title=""
value="page-fit"
data-l10n-id="page_scale_fit"
>适合页面</option
>
<option
id="pageWidthOption"
title=""
value="page-width"
data-l10n-id="page_scale_width"
>适合页宽</option
>
<option
id="customScaleOption"
title=""
value="custom"
disabled="disabled"
hidden="true"
></option>
<option
title=""
value="0.5"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 50 }'
>50%</option
>
<option
title=""
value="0.75"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 75 }'
>75%</option
>
<option
title=""
value="1"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 100 }'
>100%</option
>
<option
title=""
value="1.25"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 125 }'
>125%</option
>
<option
title=""
value="1.5"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 150 }'
>150%</option
>
<option
title=""
value="2"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 200 }'
>200%</option
>
<option
title=""
value="3"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 300 }'
>300%</option
>
<option
title=""
value="4"
data-l10n-id="page_scale_percent"
data-l10n-args='{ "scale": 400 }'
>400%</option
>
</select>
</span>
</div>
</div>
</div>
</div> </div>
<div id="page"> <div id="page">
<div id="viewerContainer"> <div id="viewerContainer">
...@@ -30,10 +197,13 @@ import $ from "jquery"; ...@@ -30,10 +197,13 @@ import $ from "jquery";
export default { export default {
data() { data() {
return { return {
pageIndex: 2, // pdf页码 pageIndex: 1, // pdf页码
pageLength: null, // 总页码
scale: 2, // 缩放比例 scale: 2, // 缩放比例
borderSize: 9, // viewerContainer容器border大小 borderSize: 9, // viewerContainer容器border大小
pageSize: 1 pageSize: 1,
selected: "0.5",
pdf: null
}; };
}, },
mounted() { mounted() {
...@@ -41,48 +211,39 @@ export default { ...@@ -41,48 +211,39 @@ export default {
this.preview(); this.preview();
}, },
methods: { methods: {
preview() { async preview() {
pdfJs if (this.pdf === null) {
.getDocument( let pdf = await pdfJs.getDocument(
// "https://qida-videos.oss-cn-shenzhen.aliyuncs.com/compressed.tracemonkey-pldi-09.pdf"
// "https://qida-videos.oss-cn-shenzhen.aliyuncs.com/product/20200415/0e8d1766-6b2a-4e1c-bd8e-be53c1f2cf4c/out.pdf"
"http://b2b-flv.qida.com/product/20191105/23386fd7-5551-4fa2-81cc-025945a75eeb/out.pdf" "http://b2b-flv.qida.com/product/20191105/23386fd7-5551-4fa2-81cc-025945a75eeb/out.pdf"
) );
.then(pdf => { console.log("获取PDF");
pdf.getPage(this.pageIndex).then(page => { this.pdf = pdf;
const devicePixelRatio = window.devicePixelRatio; }
const scale = this.pageSize * this.scale * devicePixelRatio; this.pageLength = this.pdf._pdfInfo.numPages;
const viewport = page.getViewport({ scale: scale }); let page = await this.pdf.getPage(this.pageIndex);
let { bufferCanvas, textLayerDiv, bodyHeight } = this.initPage( const devicePixelRatio = window.devicePixelRatio;
page, const scale = this.pageSize * this.scale * devicePixelRatio;
viewport const viewport = page.getViewport({ scale: scale });
); let { bufferCanvas, textLayerDiv, bodyHeight } = this.initPage(
this.renderCanvas(bufferCanvas, viewport, page); page,
page.getTextContent().then(res => { viewport
this.renderHtml( );
textLayerDiv, this.renderCanvas(bufferCanvas, viewport, page);
page, let textContent = await page.getTextContent();
scale, // page.getTextContent().then(res => {
viewport, // this.renderHtml(textLayerDiv, page, scale, viewport, bodyHeight, res);
bodyHeight, // });
res this.renderHtml(
); textLayerDiv,
}); page,
}); scale,
}); viewport,
}, bodyHeight,
zoomin() { textContent
$("#textLayerDiv").html(""); );
this.pageSize = this.pageSize + 0.05;
this.preview();
},
zoomout() {
$("#textLayerDiv").html("");
this.pageSize = this.pageSize - 0.05;
this.preview();
}, },
initPage(page, viewport) { initPage(page, viewport) {
$("#page").css("height", $("body").height() - $("#toolbar").height()); $("#page").css("height", $("body").height() - $(".toolbar").height());
let pers = viewport.width / viewport.height; let pers = viewport.width / viewport.height;
let canvasWrapper = $(".canvasWrapper"); let canvasWrapper = $(".canvasWrapper");
let viewerContainer = $("#viewerContainer"); let viewerContainer = $("#viewerContainer");
...@@ -130,6 +291,7 @@ export default { ...@@ -130,6 +291,7 @@ export default {
}); });
}, },
renderHtml(textLayerDiv, page, scale, viewport, bodyHeight, res) { renderHtml(textLayerDiv, page, scale, viewport, bodyHeight, res) {
$("#textLayerDiv").html("");
const textLayer = new TextLayerBuilder({ const textLayer = new TextLayerBuilder({
textLayerDiv: textLayerDiv, textLayerDiv: textLayerDiv,
pageIndex: this.pageIndex, pageIndex: this.pageIndex,
...@@ -139,37 +301,49 @@ export default { ...@@ -139,37 +301,49 @@ export default {
}); });
textLayer.setTextContent(res); textLayer.setTextContent(res);
textLayer.render(); textLayer.render();
},
zoomIn(pageSize) {
this.pageSize = pageSize ? pageSize : this.pageSize + 0.05;
this.preview();
},
zoomOut(pageSize) {
this.pageSize = pageSize ? pageSize : this.pageSize - 0.05;
this.preview();
},
previous() {
if (this.pageIndex === 1){
return;
}
this.pageIndex = this.pageIndex - 1;
this.preview();
},
next() {
if (this.pageIndex === this.pageLength) {
return;
}
this.pageIndex = this.pageIndex + 1;
this.preview();
},
changeSelected(value) {
if (value > this.pageSize) {
this.zoomOut(value);
} else if (value < this.pageSize) {
this.zoomIn(value);
}
} }
} }
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
@import "../node_modules/pdfjs-dist/web/pdf_viewer.css"; @import url("./css/viewer.css");
$toolbarHeigth: 32px;
* {
padding: 0;
margin: 0;
}
body {
background-color: #3c3c3c;
width: 100vw;
height: 100vh;
}
button {
border: 0 none;
background: none;
outline: none;
width: 32px;
height: 25px;
}
#app { #app {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative;
} }
#page { #page {
width: 100%; width: 100%;
top: $toolbarHeigth;
position: relative; position: relative;
overflow: auto; overflow: auto;
} }
...@@ -177,75 +351,7 @@ button { ...@@ -177,75 +351,7 @@ button {
margin: auto; margin: auto;
position: relative; position: relative;
} }
#toolbar { .taoolbarCantUse {
width: 100vw; opacity: 0.5;
height: $toolbarHeigth;
position: absolute;
left: 0;
top: 0;
text-align: center;
color: rgba(0, 0, 0, 0.8);
background-color: rgba(71, 71, 71, 1);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15),
inset 0 -1px 0 rgba(255, 255, 255, 0.05), 0 1px 0 rgba(0, 0, 0, 0.15),
0 1px 1px rgba(0, 0, 0, 0.1);
span {
margin: 0 5px;
}
}
.toolbarButton {
line-height: $toolbarHeigth;
position: relative;
top: 50%;
transform: translateY(-50%);
border: 1px solid rgba(0, 0, 0, 0);
border-radius: 1px;
text-align: center;
cursor: pointer;
&:hover {
border: 1px solid rgba(0, 0, 0, 0.3);
background: rgba(60, 60, 60, 0.8);
}
}
.pageNumber {
display: inline-block;
width: 40px;
color: #fff;
font-size: 12px;
text-align: center;
vertical-align: middle;
top: -3px;
position: relative;
-moz-user-select: none;
-khtml-user-select: none;
user-select: none;
}
.currentIndex {
border: 1px solid rgba(0, 0, 0, 0.3);
background-color: rgba(255, 255, 255, 0.09);
padding-right: 10px;
text-align: right;
margin: 0;
}
.toolbarButton::before {
position: absolute;
left: 0;
transform: scale(0.5);
display: inline-block;
}
.toolbarButton::before {
top: -7px;
}
.zoomin::before {
content: url("./assets/toolbarButton-zoomIn@2x.png");
}
.zoomout::before {
content: url("./assets/toolbarButton-zoomOut@2x.png");
}
.pageUp::before {
content: url("./assets/toolbarButton-pageUp@2x.png");
}
.pageDown::before {
content: url("./assets/toolbarButton-pageDown@2x.png");
} }
</style> </style>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="40"
viewBox="0 0 40 40">
<path
d="M 1.5006714,23.536225 6.8925879,18.994244 14.585721,26.037937 34.019683,4.5410479 38.499329,9.2235032 14.585721,35.458952 z"
id="path4"
style="fill:#ffff00;fill-opacity:1;stroke:#000000;stroke-width:1.25402856;stroke-opacity:1" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
height="40"
width="40"
viewBox="0 0 40 40">
<rect
style="fill:#ffff00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
width="33.76017"
height="33.76017"
x="3.119915"
y="3.119915" />
<path
d="m 20.677967,8.54499 c -7.342801,0 -13.295293,4.954293 -13.295293,11.065751 0,2.088793 0.3647173,3.484376 1.575539,5.150563 L 6.0267418,31.45501 13.560595,29.011117 c 2.221262,1.387962 4.125932,1.665377 7.117372,1.665377 7.3428,0 13.295291,-4.954295 13.295291,-11.065753 0,-6.111458 -5.952491,-11.065751 -13.295291,-11.065751 z"
style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0.93031836;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"/>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="40"
viewBox="0 0 40 40">
<g
transform="translate(0,-60)"
id="layer1">
<rect
width="36.460953"
height="34.805603"
x="1.7695236"
y="62.597198"
style="fill:#ffff00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1.30826771;stroke-opacity:1" />
<g
transform="matrix(0.88763677,0,0,0.88763677,2.2472646,8.9890584)">
<path
d="M 20,64.526342 C 11.454135,64.526342 4.5263421,71.454135 4.5263421,80 4.5263421,88.545865 11.454135,95.473658 20,95.473658 28.545865,95.473658 35.473658,88.545865 35.473658,80 35.473658,71.454135 28.545865,64.526342 20,64.526342 z m -0.408738,9.488564 c 3.527079,0 6.393832,2.84061 6.393832,6.335441 0,3.494831 -2.866753,6.335441 -6.393832,6.335441 -3.527079,0 -6.393832,-2.84061 -6.393832,-6.335441 0,-3.494831 2.866753,-6.335441 6.393832,-6.335441 z"
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:1.02768445;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
<path
d="m 7.2335209,71.819938 4.9702591,4.161823 c -1.679956,2.581606 -1.443939,6.069592 0.159325,8.677725 l -5.1263071,3.424463 c 0.67516,1.231452 3.0166401,3.547686 4.2331971,4.194757 l 3.907728,-4.567277 c 2.541952,1.45975 5.730694,1.392161 8.438683,-0.12614 l 3.469517,6.108336 c 1.129779,-0.44367 4.742234,-3.449633 5.416358,-5.003859 l -5.46204,-4.415541 c 1.44319,-2.424098 1.651175,-5.267515 0.557303,-7.748623 l 5.903195,-3.833951 C 33.14257,71.704996 30.616217,69.018606 29.02952,67.99296 l -4.118813,4.981678 C 22.411934,71.205099 18.900853,70.937534 16.041319,72.32916 l -3.595408,-5.322091 c -1.345962,0.579488 -4.1293881,2.921233 -5.2123901,4.812869 z m 8.1010311,3.426672 c 2.75284,-2.446266 6.769149,-2.144694 9.048998,0.420874 2.279848,2.56557 2.113919,6.596919 -0.638924,9.043185 -2.752841,2.446267 -6.775754,2.13726 -9.055604,-0.428308 -2.279851,-2.565568 -2.107313,-6.589485 0.64553,-9.035751 z"
style="fill:#000000;fill-opacity:1;stroke:none" />
</g>
</g>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="64"
height="64"
viewBox="0 0 64 64">
<path
d="M 32.003143,1.4044602 57.432701,62.632577 6.5672991,62.627924 z"
style="fill:#ffff00;fill-opacity:0.94117647;fill-rule:nonzero;stroke:#000000;stroke-width:1.00493038;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="64"
height="64"
viewBox="0 0 64 64">
<path
d="M 25.470843,9.4933766 C 25.30219,12.141818 30.139101,14.445969 34.704831,13.529144 40.62635,12.541995 41.398833,7.3856498 35.97505,5.777863 31.400921,4.1549155 25.157674,6.5445892 25.470843,9.4933766 z M 4.5246282,17.652051 C 4.068249,11.832873 9.2742983,5.9270407 18.437379,3.0977088 29.751911,-0.87185184 45.495663,1.4008022 53.603953,7.1104009 c 9.275765,6.1889221 7.158128,16.2079421 -3.171076,21.5939521 -1.784316,1.635815 -6.380222,1.21421 -7.068351,3.186186 -1.04003,0.972427 -1.288046,2.050158 -1.232864,3.168203 1.015111,2.000108 -3.831548,1.633216 -3.270553,3.759574 0.589477,5.264544 -0.179276,10.53738 -0.362842,15.806257 -0.492006,2.184998 1.163456,4.574232 -0.734888,6.610642 -2.482919,2.325184 -7.30604,2.189143 -9.193497,-0.274767 -2.733688,-1.740626 -8.254447,-3.615254 -6.104247,-6.339626 3.468112,-1.708686 -2.116197,-3.449897 0.431242,-5.080274 5.058402,-1.39256 -2.393215,-2.304318 -0.146889,-4.334645 3.069198,-0.977415 2.056986,-2.518352 -0.219121,-3.540397 1.876567,-1.807151 1.484149,-4.868919 -2.565455,-5.942205 0.150866,-1.805474 2.905737,-4.136876 -1.679967,-5.20493 C 10.260902,27.882167 4.6872697,22.95045 4.5245945,17.652051 z"
id="path604"
style="fill:#ffff00;fill-opacity:1;stroke:#000000;stroke-width:1.72665179;stroke-opacity:1" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="64"
height="64"
viewBox="0 0 64 64">
<path
d="M 32.003143,10.913072 57.432701,53.086929 6.567299,53.083723 z"
id="path2985"
style="fill:#ffff00;fill-opacity:0.94117647;fill-rule:nonzero;stroke:#000000;stroke-width:0.83403099;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="40"
viewBox="0 0 40 40">
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="40"
viewBox="0 0 40 40">
<rect
width="36.075428"
height="31.096582"
x="1.962286"
y="4.4517088"
id="rect4"
style="fill:#ffff00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1.23004246;stroke-opacity:1" />
<rect
width="27.96859"
height="1.5012145"
x="6.0157046"
y="10.285"
id="rect6"
style="fill:#000000;fill-opacity:1;stroke:none" />
<rect
width="27.96859"
height="0.85783684"
x="6.0157056"
y="23.21689"
id="rect8"
style="fill:#000000;fill-opacity:1;stroke:none" />
<rect
width="27.96859"
height="0.85783684"
x="5.8130345"
y="28.964394"
id="rect10"
style="fill:#000000;fill-opacity:1;stroke:none" />
<rect
width="27.96859"
height="0.85783684"
x="6.0157046"
y="17.426493"
id="rect12"
style="fill:#000000;fill-opacity:1;stroke:none" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns="http://www.w3.org/2000/svg"
width="40"
height="40"
viewBox="0 0 40 40">
<rect
width="33.76017"
height="33.76017"
x="3.119915"
y="3.119915"
style="fill:#ffff00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" />
<path
d="m 17.692678,34.50206 0,-16.182224 c -1.930515,-0.103225 -3.455824,-0.730383 -4.57593,-1.881473 -1.12011,-1.151067 -1.680164,-2.619596 -1.680164,-4.405591 0,-1.992435 0.621995,-3.5796849 1.865988,-4.7617553 1.243989,-1.1820288 3.06352,-1.7730536 5.458598,-1.7730764 l 9.802246,0 0,2.6789711 -2.229895,0 0,26.3251486 -2.632515,0 0,-26.3251486 -3.45324,0 0,26.3251486 z"
style="font-size:29.42051125px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:1.07795751;stroke-opacity:1;font-family:Arial;-inkscape-font-specification:Arial" />
</svg>
/* Copyright 2014 Mozilla Foundation
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
@import url("./../../node_modules/pdfjs-dist/web/pdf_viewer.css");
:root {
--sidebar-width: 200px;
--sidebar-transition-duration: 200ms;
--sidebar-transition-timing-function: ease;
}
* {
padding: 0;
margin: 0;
}
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: rgba(64, 64, 64, 1);
background-image: url(../assets/texture.png);
}
body,
input,
button,
select {
font: message-box;
outline: none;
}
.hidden {
display: none !important;
}
[hidden] {
display: none !important;
}
.pdfViewer.enablePermissions .textLayer > span {
user-select: none !important;
cursor: not-allowed;
}
#viewerContainer.pdfPresentationMode:-ms-fullscreen {
top: 0px !important;
overflow: hidden !important;
}
#viewerContainer.pdfPresentationMode:-ms-fullscreen::-ms-backdrop {
background-color: rgba(0, 0, 0, 1);
}
#viewerContainer.pdfPresentationMode:fullscreen {
top: 0px;
border-top: 2px solid rgba(0, 0, 0, 0);
background-color: rgba(0, 0, 0, 1);
width: 100%;
height: 100%;
overflow: hidden;
cursor: none;
user-select: none;
}
.pdfPresentationMode:fullscreen a:not(.internalLink) {
display: none;
}
.pdfPresentationMode:fullscreen .textLayer > span {
cursor: none;
}
.pdfPresentationMode.pdfPresentationModeControls > *,
.pdfPresentationMode.pdfPresentationModeControls .textLayer > span {
cursor: default;
}
#outerContainer {
width: 100%;
height: 100%;
position: relative;
}
#sidebarContainer {
position: absolute;
top: 32px;
bottom: 0;
width: var(--sidebar-width);
visibility: hidden;
z-index: 100;
border-top: 1px solid rgba(51, 51, 51, 1);
transition-duration: var(--sidebar-transition-duration);
transition-timing-function: var(--sidebar-transition-timing-function);
}
html[dir='ltr'] #sidebarContainer {
transition-property: left;
left: calc(0px - var(--sidebar-width));
}
html[dir='rtl'] #sidebarContainer {
transition-property: right;
right: calc(0px - var(--sidebar-width));
}
.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. */
user-select: none;
}
#outerContainer.sidebarMoving #sidebarContainer,
#outerContainer.sidebarOpen #sidebarContainer {
visibility: visible;
}
html[dir='ltr'] #outerContainer.sidebarOpen #sidebarContainer {
left: 0px;
}
html[dir='rtl'] #outerContainer.sidebarOpen #sidebarContainer {
right: 0px;
}
#mainContainer {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
min-width: 320px;
}
#sidebarContent {
top: 32px;
bottom: 0;
overflow: auto;
-webkit-overflow-scrolling: touch;
position: absolute;
width: 100%;
background-color: rgba(0, 0, 0, 0.1);
}
html[dir='ltr'] #sidebarContent {
left: 0;
box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25);
}
html[dir='rtl'] #sidebarContent {
right: 0;
box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25);
}
#viewerContainer {
overflow: auto;
-webkit-overflow-scrolling: touch;
position: absolute;
/* top: 32px; */
right: 0;
bottom: 0;
left: 0;
outline: none;
}
#viewerContainer:not(.pdfPresentationMode) {
transition-duration: var(--sidebar-transition-duration);
transition-timing-function: var(--sidebar-transition-timing-function);
}
html[dir='ltr'] #viewerContainer {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.05);
}
html[dir='rtl'] #viewerContainer {
box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.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: var(--sidebar-width);
}
html[dir='rtl'] #outerContainer.sidebarOpen #viewerContainer:not(.pdfPresentationMode) {
transition-property: right;
right: var(--sidebar-width);
}
.toolbar {
position: relative;
left: 0;
right: 0;
z-index: 9999;
cursor: default;
}
#toolbarContainer {
width: 100%;
}
#toolbarSidebar {
width: 100%;
height: 32px;
background-color: rgba(66, 66, 66, 1); /* fallback */
background-image: url(../assets/texture.png),
linear-gradient(rgba(77, 77, 77, 0.99), rgba(64, 64, 64, 0.95));
}
html[dir='ltr'] #toolbarSidebar {
box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25),
inset 0 -1px 0 rgba(255, 255, 255, 0.05),
0 1px 0 rgba(0, 0, 0, 0.15),
0 0 1px rgba(0, 0, 0, 0.1);
}
html[dir='rtl'] #toolbarSidebar {
box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25),
inset 0 1px 0 rgba(255, 255, 255, 0.05),
0 1px 0 rgba(0, 0, 0, 0.15),
0 0 1px rgba(0, 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;
background-color: rgba(71, 71, 71, 1); /* fallback */
background-image: url(../assets/texture.png),
linear-gradient(rgba(82, 82, 82, 0.99), rgba(69, 69, 69, 0.95));
}
html[dir='ltr'] #toolbarContainer, .findbar, .secondaryToolbar {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15),
inset 0 -1px 0 rgba(255, 255, 255, 0.05),
0 1px 0 rgba(0, 0, 0, 0.15),
0 1px 1px rgba(0, 0, 0, 0.1);
}
html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15),
inset 0 -1px 0 rgba(255, 255, 255, 0.05),
0 1px 0 rgba(0, 0, 0, 0.15),
0 1px 1px rgba(0, 0, 0, 0.1);
}
#toolbarViewer {
height: 32px;
}
#loadingBar {
position: relative;
width: 100%;
height: 4px;
background-color: rgba(51, 51, 51, 1);
border-bottom: 1px solid rgba(51, 51, 51, 1);
}
#loadingBar .progress {
position: absolute;
top: 0;
left: 0;
width: 0%;
height: 100%;
background-color: rgba(221, 221, 221, 1);
overflow: hidden;
transition: width 200ms;
}
@keyframes progressIndeterminate {
0% { left: -142px; }
100% { left: 0; }
}
#loadingBar .progress.indeterminate {
background-color: rgba(153, 153, 153, 1);
transition: none;
}
#loadingBar .progress.indeterminate .glimmer {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: calc(100% + 150px);
background: repeating-linear-gradient(135deg,
rgba(187, 187, 187, 1) 0, rgba(153, 153, 153, 1) 5px,
rgba(153, 153, 153, 1) 45px, rgba(221, 221, 221, 1) 55px,
rgba(221, 221, 221, 1) 95px, rgba(187, 187, 187, 1) 100px);
animation: progressIndeterminate 950ms linear infinite;
}
.findbar, .secondaryToolbar {
top: 32px;
position: absolute;
z-index: 10000;
height: auto;
min-width: 16px;
padding: 0px 6px 0px 6px;
margin: 4px 2px 4px 2px;
color: rgba(217, 217, 217, 1);
font-size: 12px;
line-height: 14px;
text-align: left;
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 {
user-select: none;
}
#findInput {
width: 200px;
}
#findInput::-webkit-input-placeholder {
color: rgba(191, 191, 191, 1);
}
#findInput::placeholder {
font-style: italic;
}
#findInput[data-status="pending"] {
background-image: url(../assets/loading-small.png);
background-repeat: no-repeat;
background-position: right;
}
html[dir='rtl'] #findInput[data-status="pending"] {
background-position: left;
}
.secondaryToolbar {
padding: 6px;
height: auto;
z-index: 30000;
}
html[dir='ltr'] .secondaryToolbar {
right: 4px;
}
html[dir='rtl'] .secondaryToolbar {
left: 4px;
}
#secondaryToolbarButtonContainer {
max-width: 200px;
max-height: 400px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
margin-bottom: -4px;
}
#secondaryToolbarButtonContainer.hiddenScrollModeButtons > .scrollModeButtons,
#secondaryToolbarButtonContainer.hiddenSpreadModeButtons > .spreadModeButtons {
display: none !important;
}
.doorHanger,
.doorHangerRight {
border: 1px solid rgba(0, 0, 0, 0.5);
border-radius: 2px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.doorHanger:after, .doorHanger:before,
.doorHangerRight:after, .doorHangerRight:before {
bottom: 100%;
border: solid rgba(0, 0, 0, 0);
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.doorHanger:after,
.doorHangerRight:after {
border-bottom-color: rgba(82, 82, 82, 0.99);
border-width: 8px;
}
.doorHanger:before,
.doorHangerRight:before {
border-bottom-color: rgba(0, 0, 0, 0.5);
border-width: 9px;
}
html[dir='ltr'] .doorHanger:after,
html[dir='rtl'] .doorHangerRight:after {
left: 13px;
margin-left: -8px;
}
html[dir='ltr'] .doorHanger:before,
html[dir='rtl'] .doorHangerRight:before {
left: 13px;
margin-left: -9px;
}
html[dir='rtl'] .doorHanger:after,
html[dir='ltr'] .doorHangerRight:after {
right: 13px;
margin-right: -8px;
}
html[dir='rtl'] .doorHanger:before,
html[dir='ltr'] .doorHangerRight:before {
right: 13px;
margin-right: -9px;
}
#findResultsCount {
background-color: rgba(217, 217, 217, 1);
color: rgba(82, 82, 82, 1);
text-align: center;
padding: 3px 4px;
}
#findMsg {
font-style: italic;
color: rgba(166, 183, 208, 1);
}
#findMsg:empty {
display: none;
}
#findInput.notFound {
background-color: rgba(255, 102, 102, 1);
}
#toolbarViewerMiddle {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
html[dir='ltr'] #toolbarViewerLeft,
html[dir='rtl'] #toolbarViewerRight {
float: left;
}
html[dir='ltr'] #toolbarViewerRight,
html[dir='rtl'] #toolbarViewerLeft {
float: right;
}
html[dir='ltr'] #toolbarViewerLeft > *,
html[dir='ltr'] #toolbarViewerMiddle > *,
html[dir='ltr'] #toolbarViewerRight > *,
html[dir='ltr'] .findbar * {
position: relative;
float: left;
}
html[dir='rtl'] #toolbarViewerLeft > *,
html[dir='rtl'] #toolbarViewerMiddle > *,
html[dir='rtl'] #toolbarViewerRight > *,
html[dir='rtl'] .findbar * {
position: relative;
float: right;
}
html[dir='ltr'] .splitToolbarButton {
margin: 3px 2px 4px 0;
display: inline-block;
}
html[dir='rtl'] .splitToolbarButton {
margin: 3px 0 4px 2px;
display: inline-block;
}
html[dir='ltr'] .splitToolbarButton > .toolbarButton {
border-radius: 0;
float: left;
}
html[dir='rtl'] .splitToolbarButton > .toolbarButton {
border-radius: 0;
float: right;
}
.toolbarButton,
.secondaryToolbarButton,
.overlayButton {
border: 0 none;
background: none;
width: 32px;
height: 25px;
}
.toolbarButton > span {
display: inline-block;
width: 0;
height: 0;
overflow: hidden;
}
.toolbarButton[disabled],
.secondaryToolbarButton[disabled],
.overlayButton[disabled] {
opacity: .5;
}
.splitToolbarButton.toggled .toolbarButton {
margin: 0;
}
.splitToolbarButton:hover > .toolbarButton,
.splitToolbarButton:focus > .toolbarButton,
.splitToolbarButton.toggled > .toolbarButton,
.toolbarButton.textButton {
background-color: rgba(0, 0, 0, 0.12);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.35);
border-color: rgba(0, 0, 0, 0.32) rgba(0, 0, 0, 0.38) rgba(0, 0, 0, 0.42);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.15) inset,
0 1px 0 rgba(255, 255, 255, 0.05);
}
.splitToolbarButton > .toolbarButton:hover,
.splitToolbarButton > .toolbarButton:focus,
.dropdownToolbarButton:hover,
.overlayButton:hover,
.overlayButton:focus,
.toolbarButton.textButton:hover,
.toolbarButton.textButton:focus {
background-color: rgba(0,0,0,0.2);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.15) inset,
0 0 1px rgba(0, 0, 0, 0.05);
z-index: 199;
}
.dropdownToolbarButton:hover {
background-color: rgba(0, 0, 0, 0.26);
}
.splitToolbarButton > .toolbarButton {
position: relative;
}
html[dir='ltr'] .splitToolbarButton > .toolbarButton:first-child,
html[dir='rtl'] .splitToolbarButton > .toolbarButton:last-child {
position: relative;
margin: 0;
margin-right: -1px;
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
border-right-color: rgba(0, 0, 0, 0);
}
html[dir='ltr'] .splitToolbarButton > .toolbarButton:last-child,
html[dir='rtl'] .splitToolbarButton > .toolbarButton:first-child {
position: relative;
margin: 0;
margin-left: -1px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
border-left-color: rgba(0, 0, 0, 0);
}
.splitToolbarButtonSeparator {
padding: 8px 0;
width: 1px;
background-color: rgba(0, 0, 0, 0.5);
z-index: 99;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
display: inline-block;
margin: 5px 0;
}
html[dir='ltr'] .splitToolbarButtonSeparator {
float: left;
}
html[dir='rtl'] .splitToolbarButtonSeparator {
float: right;
}
.splitToolbarButton:hover > .splitToolbarButtonSeparator,
.splitToolbarButton.toggled > .splitToolbarButtonSeparator {
padding: 12px 0;
margin: 1px 0;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.toolbarButton,
.dropdownToolbarButton,
.secondaryToolbarButton,
.overlayButton {
min-width: 16px;
padding: 2px 6px 0;
border: 1px solid rgba(0, 0, 0, 0);
border-radius: 2px;
color: rgba(255, 255, 255, 0.8);
font-size: 12px;
line-height: 14px;
user-select: none;
/* Opera does not support user-select, use <... unselectable="on"> instead */
cursor: default;
}
html[dir='ltr'] .toolbarButton,
html[dir='ltr'] .overlayButton,
html[dir='ltr'] .dropdownToolbarButton {
margin: 3px 2px 4px 0;
}
html[dir='rtl'] .toolbarButton,
html[dir='rtl'] .overlayButton,
html[dir='rtl'] .dropdownToolbarButton {
margin: 3px 0 4px 2px;
}
.toolbarButton:hover,
.toolbarButton:focus,
.dropdownToolbarButton,
.overlayButton,
.secondaryToolbarButton:hover,
.secondaryToolbarButton:focus {
background-color: rgba(0, 0, 0, 0.12);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.35);
border-color: rgba(0, 0, 0, 0.32) rgba(0, 0, 0, 0.38) rgba(0, 0, 0, 0.42);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.15) inset,
0 1px 0 rgba(255, 255, 255, 0.05);
}
.toolbarButton:hover:active,
.overlayButton:hover:active,
.dropdownToolbarButton:hover:active,
.secondaryToolbarButton:hover:active {
background-color: rgba(0, 0, 0, 0.2);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
border-color: rgba(0, 0, 0, 0.35) rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.45);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) inset,
0 0 1px rgba(0, 0, 0, 0.2) inset,
0 1px 0 rgba(255, 255, 255, 0.05);
}
.toolbarButton.toggled,
.splitToolbarButton.toggled > .toolbarButton.toggled,
.secondaryToolbarButton.toggled {
background-color: rgba(0, 0, 0, 0.3);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
border-color: rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.45) rgba(0, 0, 0, 0.5);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) inset,
0 0 1px rgba(0, 0, 0, 0.2) inset,
0 1px 0 rgba(255, 255, 255, 0.05);
}
.toolbarButton.toggled:hover:active,
.splitToolbarButton.toggled > .toolbarButton.toggled:hover:active,
.secondaryToolbarButton.toggled:hover:active {
background-color: rgba(0, 0, 0, 0.4);
border-color: rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0.55);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) inset,
0 0 1px rgba(0, 0, 0, 0.3) inset,
0 1px 0 rgba(255, 255, 255, 0.05);
}
.dropdownToolbarButton {
width: 140px;
padding: 0;
overflow: hidden;
}
.dropdownToolbarButton::after {
position: absolute;
display: inline-block;
top: 4px;
content: url(../assets/toolbarButton-menuArrows.png);
}
html[dir='ltr'] .dropdownToolbarButton::after {
right: 8px;
}
html[dir='rtl'] .dropdownToolbarButton::after {
left: 8px;
}
.dropdownToolbarButton > select {
width: 162px;
height: 23px;
font-size: 12px;
color: rgba(242, 242, 242, 1);
margin: 0;
padding: 3px 2px 2px;
border: none;
background: rgba(0,0,0,0); /* Opera does not support 'transparent' <select> background */
}
.dropdownToolbarButton > select > option {
background: rgba(61, 61, 61, 1);
}
#customScaleOption {
display: none;
}
#pageWidthOption {
border-bottom: 1px rgba(255, 255, 255, 0.5) solid;
}
html[dir='ltr'] .splitToolbarButton:first-child,
html[dir='ltr'] .toolbarButton:first-child,
html[dir='rtl'] .splitToolbarButton:last-child,
html[dir='rtl'] .toolbarButton:last-child {
margin-left: 4px;
}
html[dir='ltr'] .splitToolbarButton:last-child,
html[dir='ltr'] .toolbarButton:last-child,
html[dir='rtl'] .splitToolbarButton:first-child,
html[dir='rtl'] .toolbarButton:first-child {
margin-right: 4px;
}
.toolbarButtonSpacer {
width: 30px;
display: inline-block;
height: 1px;
}
html[dir='ltr'] #findPrevious {
margin-left: 3px;
}
html[dir='ltr'] #findNext {
margin-right: 3px;
}
html[dir='rtl'] #findPrevious {
margin-right: 3px;
}
html[dir='rtl'] #findNext {
margin-left: 3px;
}
.toolbarButton::before,
.secondaryToolbarButton::before {
/* All matching ../assets have a size of 16x16
* All relevant containers have a size of 32x25 */
position: absolute;
display: inline-block;
top: 4px;
left: 7px;
}
html[dir="ltr"] .secondaryToolbarButton::before {
left: 4px;
}
html[dir="rtl"] .secondaryToolbarButton::before {
right: 4px;
}
.toolbarButton#sidebarToggle::before {
content: url(../assets/toolbarButton-sidebarToggle.png);
}
html[dir='rtl'] .toolbarButton#sidebarToggle::before {
transform: scaleX(-1);
}
.toolbarButton#secondaryToolbarToggle::before {
content: url(../assets/toolbarButton-secondaryToolbarToggle.png);
}
html[dir='rtl'] .toolbarButton#secondaryToolbarToggle::before {
transform: scaleX(-1);
}
.toolbarButton.findPrevious::before {
content: url(../assets/findbarButton-previous.png);
}
html[dir='rtl'] .toolbarButton.findPrevious::before {
transform: scaleX(-1);
}
.toolbarButton.findNext::before {
content: url(../assets/findbarButton-next.png);
}
html[dir='rtl'] .toolbarButton.findNext::before {
transform: scaleX(-1);
}
.toolbarButton.pageUp::before {
content: url(../assets/toolbarButton-pageUp.png);
}
html[dir='rtl'] .toolbarButton.pageUp::before {
transform: scaleX(-1);
}
.toolbarButton.pageDown::before {
content: url(../assets/toolbarButton-pageDown.png);
}
html[dir='rtl'] .toolbarButton.pageDown::before {
transform: scaleX(-1);
}
.toolbarButton.zoomOut::before {
content: url(../assets/toolbarButton-zoomOut.png);
}
.toolbarButton.zoomIn::before {
content: url(../assets/toolbarButton-zoomIn.png);
}
.toolbarButton.presentationMode::before,
.secondaryToolbarButton.presentationMode::before {
content: url(../assets/toolbarButton-presentationMode.png);
}
.toolbarButton.print::before,
.secondaryToolbarButton.print::before {
content: url(../assets/toolbarButton-print.png);
}
.toolbarButton.openFile::before,
.secondaryToolbarButton.openFile::before {
content: url(../assets/toolbarButton-openFile.png);
}
.toolbarButton.download::before,
.secondaryToolbarButton.download::before {
content: url(../assets/toolbarButton-download.png);
}
.toolbarButton.bookmark,
.secondaryToolbarButton.bookmark {
box-sizing: border-box;
outline: none;
padding-top: 4px;
text-decoration: none;
}
.secondaryToolbarButton.bookmark {
padding-top: 5px;
}
.bookmark[href='#'] {
opacity: .5;
pointer-events: none;
}
.toolbarButton.bookmark::before,
.secondaryToolbarButton.bookmark::before {
content: url(../assets/toolbarButton-bookmark.png);
}
#viewThumbnail.toolbarButton::before {
content: url(../assets/toolbarButton-viewThumbnail.png);
}
#viewOutline.toolbarButton::before {
content: url(../assets/toolbarButton-viewOutline.png);
}
html[dir="rtl"] #viewOutline.toolbarButton::before {
transform: scaleX(-1);
}
#viewAttachments.toolbarButton::before {
content: url(../assets/toolbarButton-viewAttachments.png);
}
#viewFind.toolbarButton::before {
content: url(../assets/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: rgba(112, 219, 85, 1);
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;
padding: 3px 0 1px 0;
height: auto;
min-height: 25px;
width: auto;
min-width: 100%;
white-space: normal;
}
html[dir="ltr"] .secondaryToolbarButton {
padding-left: 24px;
text-align: left;
}
html[dir="rtl"] .secondaryToolbarButton {
padding-right: 24px;
text-align: right;
}
html[dir="ltr"] .secondaryToolbarButton.bookmark {
padding-left: 27px;
}
html[dir="rtl"] .secondaryToolbarButton.bookmark {
padding-right: 27px;
}
html[dir="ltr"] .secondaryToolbarButton > span {
padding-right: 4px;
}
html[dir="rtl"] .secondaryToolbarButton > span {
padding-left: 4px;
}
.secondaryToolbarButton.firstPage::before {
content: url(../assets/secondaryToolbarButton-firstPage.png);
}
.secondaryToolbarButton.lastPage::before {
content: url(../assets/secondaryToolbarButton-lastPage.png);
}
.secondaryToolbarButton.rotateCcw::before {
content: url(../assets/secondaryToolbarButton-rotateCcw.png);
}
.secondaryToolbarButton.rotateCw::before {
content: url(../assets/secondaryToolbarButton-rotateCw.png);
}
.secondaryToolbarButton.selectTool::before {
content: url(../assets/secondaryToolbarButton-selectTool.png);
}
.secondaryToolbarButton.handTool::before {
content: url(../assets/secondaryToolbarButton-handTool.png);
}
.secondaryToolbarButton.scrollVertical::before {
content: url(../assets/secondaryToolbarButton-scrollVertical.png);
}
.secondaryToolbarButton.scrollHorizontal::before {
content: url(../assets/secondaryToolbarButton-scrollHorizontal.png);
}
.secondaryToolbarButton.scrollWrapped::before {
content: url(../assets/secondaryToolbarButton-scrollWrapped.png);
}
.secondaryToolbarButton.spreadNone::before {
content: url(../assets/secondaryToolbarButton-spreadNone.png);
}
.secondaryToolbarButton.spreadOdd::before {
content: url(../assets/secondaryToolbarButton-spreadOdd.png);
}
.secondaryToolbarButton.spreadEven::before {
content: url(../assets/secondaryToolbarButton-spreadEven.png);
}
.secondaryToolbarButton.documentProperties::before {
content: url(../assets/secondaryToolbarButton-documentProperties.png);
}
.verticalToolbarSeparator {
display: block;
padding: 8px 0;
margin: 8px 4px;
width: 1px;
background-color: rgba(0, 0, 0, 0.5);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
html[dir='ltr'] .verticalToolbarSeparator {
margin-left: 2px;
}
html[dir='rtl'] .verticalToolbarSeparator {
margin-right: 2px;
}
.horizontalToolbarSeparator {
display: block;
margin: 0 0 4px 0;
height: 1px;
width: 100%;
background-color: rgba(0, 0, 0, 0.5);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.toolbarField {
padding: 3px 6px;
margin: 4px 0 4px 0;
border-radius: 2px;
background-color: rgba(255, 255, 255, 0.09);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
border-width: 1px;
border-style: solid;
border-color: rgba(0, 0, 0, 0.32) rgba(0, 0, 0, 0.38) rgba(0, 0, 0, 0.42);
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05) inset,
0 1px 0 rgba(255, 255, 255, 0.05);
color: rgba(242, 242, 242, 1);
font-size: 12px;
line-height: 14px;
outline-style: none;
}
.toolbarField[type=checkbox] {
display: inline-block;
margin: 8px 0px;
}
.toolbarField.pageNumber {
-moz-appearance: textfield; /* hides the spinner in moz */
min-width: 16px;
text-align: right;
width: 40px;
}
.toolbarField.pageNumber.visiblePageIsLoading {
background-image: url(../assets/loading-small.png);
background-repeat: no-repeat;
background-position: 1px;
}
.toolbarField.pageNumber::-webkit-inner-spin-button,
.toolbarField.pageNumber::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.toolbarField:hover {
background-color: rgba(255, 255, 255, 0.11);
border-color: rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.43) rgba(0, 0, 0, 0.45);
}
.toolbarField:focus {
background-color: rgba(255, 255, 255, 0.15);
border-color: rgba(77, 184, 255, 0.8) rgba(77, 184, 255, 0.85) rgba(77, 184, 255, 0.9);
}
.toolbarLabel {
min-width: 16px;
padding: 3px 6px 3px 2px;
margin: 4px 2px 4px 0;
border: 1px solid rgba(0, 0, 0, 0);
border-radius: 2px;
color: rgba(217, 217, 217, 1);
font-size: 12px;
line-height: 14px;
text-align: left;
user-select: none;
cursor: default;
}
#thumbnailView {
position: absolute;
width: calc(100% - 60px);
top: 0;
bottom: 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;
}
html[dir='rtl'] .thumbnail {
float: right;
}
#thumbnailView > a:last-of-type > .thumbnail {
margin-bottom: 10px;
}
#thumbnailView > a:last-of-type > .thumbnail:not([data-loaded]) {
margin-bottom: 9px;
}
.thumbnail:not([data-loaded]) {
border: 1px dashed rgba(255, 255, 255, 0.5);
margin: -1px 9px 4px 9px;
}
.thumbnailImage {
border: 1px solid rgba(0, 0, 0, 0);
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
opacity: 0.8;
z-index: 99;
background-color: rgba(255, 255, 255, 1);
background-clip: content-box;
}
.thumbnailSelectionRing {
border-radius: 2px;
padding: 7px;
}
a:focus > .thumbnail > .thumbnailSelectionRing > .thumbnailImage,
.thumbnail:hover > .thumbnailSelectionRing > .thumbnailImage {
opacity: .9;
}
a:focus > .thumbnail > .thumbnailSelectionRing,
.thumbnail:hover > .thumbnailSelectionRing {
background-color: rgba(255, 255, 255, 0.15);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.2) inset,
0 0 1px rgba(0, 0, 0, 0.2);
color: rgba(255, 255, 255, 0.9);
}
.thumbnail.selected > .thumbnailSelectionRing > .thumbnailImage {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5);
opacity: 1;
}
.thumbnail.selected > .thumbnailSelectionRing {
background-color: rgba(255, 255, 255, 0.3);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.1) inset,
0 0 1px rgba(0, 0, 0, 0.2);
color: rgba(255, 255, 255,1);
}
#outlineView,
#attachmentsView {
position: absolute;
width: calc(100% - 8px);
top: 0;
bottom: 0;
overflow: auto;
-webkit-overflow-scrolling: touch;
user-select: none;
}
#outlineView {
padding: 4px 4px 0;
}
#attachmentsView {
padding: 3px 4px 0;
}
html[dir='ltr'] .outlineWithDeepNesting > .outlineItem,
html[dir='ltr'] .outlineItem > .outlineItems {
margin-left: 20px;
}
html[dir='rtl'] .outlineWithDeepNesting > .outlineItem,
html[dir='rtl'] .outlineItem > .outlineItems {
margin-right: 20px;
}
.outlineItem > a,
.attachmentsItem > button {
text-decoration: none;
display: inline-block;
min-width: 95%;
min-width: calc(100% - 4px); /* Subtract the right padding (left, in RTL mode)
of the container. */
height: auto;
margin-bottom: 1px;
border-radius: 2px;
color: rgba(255, 255, 255, 0.8);
font-size: 13px;
line-height: 15px;
user-select: none;
white-space: normal;
}
.attachmentsItem > button {
border: 0 none;
background: none;
cursor: pointer;
width: 100%;
}
html[dir='ltr'] .outlineItem > a {
padding: 2px 0 5px 4px;
}
html[dir='ltr'] .attachmentsItem > button {
padding: 2px 0 3px 7px;
text-align: left;
}
html[dir='rtl'] .outlineItem > a {
padding: 2px 4px 5px 0;
}
html[dir='rtl'] .attachmentsItem > button {
padding: 2px 7px 3px 0;
text-align: right;
}
.outlineItemToggler {
position: relative;
height: 0;
width: 0;
color: rgba(255, 255, 255, 0.5);
}
.outlineItemToggler::before {
content: url(../assets/treeitem-expanded.png);
display: inline-block;
position: absolute;
}
.outlineItemToggler.outlineItemsHidden::before {
content: url(../assets/treeitem-collapsed.png);
}
html[dir='rtl'] .outlineItemToggler.outlineItemsHidden::before {
transform: scaleX(-1);
}
.outlineItemToggler.outlineItemsHidden ~ .outlineItems {
display: none;
}
html[dir='ltr'] .outlineItemToggler {
float: left;
}
html[dir='rtl'] .outlineItemToggler {
float: right;
}
html[dir='ltr'] .outlineItemToggler::before {
right: 4px;
}
html[dir='rtl'] .outlineItemToggler::before {
left: 4px;
}
.outlineItemToggler:hover,
.outlineItemToggler:hover + a,
.outlineItemToggler:hover ~ .outlineItems,
.outlineItem > a:hover,
.attachmentsItem > button:hover {
background-color: rgba(255, 255, 255, 0.02);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.2) inset,
0 0 1px rgba(0, 0, 0, 0.2);
border-radius: 2px;
color: rgba(255, 255, 255, 0.9);
}
.outlineItem.selected {
background-color: rgba(255, 255, 255, 0.08);
background-image: linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0));
background-clip: padding-box;
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05) inset,
0 0 1px rgba(255, 255, 255, 0.1) inset,
0 0 1px rgba(0, 0, 0, 0.2);
color: rgba(255, 255, 255, 1);
}
.noResults {
font-size: 12px;
color: rgba(255, 255, 255, 0.8);
font-style: italic;
cursor: default;
}
/* 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);
}
#errorWrapper {
background: none repeat scroll 0 0 rgba(255, 85, 85, 1);
color: rgba(255, 255, 255, 1);
left: 0;
position: absolute;
right: 0;
z-index: 1000;
padding: 3px;
font-size: 0.8em;
}
.loadingInProgress #errorWrapper {
top: 37px;
}
#errorMessageLeft {
float: left;
}
#errorMessageRight {
float: right;
}
#errorMoreInfo {
background-color: rgba(255, 255, 255, 1);
color: rgba(0, 0, 0, 1);
padding: 3px;
margin: 3px;
width: 98%;
}
.overlayButton {
width: auto;
margin: 3px 4px 2px 4px !important;
padding: 2px 6px 3px 6px;
}
#overlayContainer {
display: table;
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
z-index: 40000;
}
#overlayContainer > * {
overflow: auto;
-webkit-overflow-scrolling: touch;
}
#overlayContainer > .container {
display: table-cell;
vertical-align: middle;
text-align: center;
}
#overlayContainer > .container > .dialog {
display: inline-block;
padding: 15px;
border-spacing: 4px;
color: rgba(217, 217, 217, 1);
font-size: 12px;
line-height: 14px;
background-color: rgba(71, 71, 71, 1); /* fallback */
background-image: url(../assets/texture.png),
linear-gradient(rgba(82, 82, 82,0.99), rgba(69, 69, 69, 0.95));
border: 1px solid rgba(0, 0, 0, 0.5);
border-radius: 4px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}
.dialog > .row {
display: table-row;
}
.dialog > .row > * {
display: table-cell;
}
.dialog .toolbarField {
margin: 5px 0;
}
.dialog .separator {
display: block;
margin: 4px 0 4px 0;
height: 1px;
width: 100%;
background-color: rgba(0, 0, 0, 0.5);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.dialog .buttonRow {
text-align: center;
vertical-align: middle;
}
.dialog :link {
color: rgba(255, 255, 255, 1);
}
#passwordOverlay > .dialog {
text-align: center;
}
#passwordOverlay .toolbarField {
width: 200px;
}
#documentPropertiesOverlay > .dialog {
text-align: left;
}
#documentPropertiesOverlay .row > * {
min-width: 100px;
}
html[dir='ltr'] #documentPropertiesOverlay .row > * {
text-align: left;
}
html[dir='rtl'] #documentPropertiesOverlay .row > * {
text-align: right;
}
#documentPropertiesOverlay .row > span {
width: 125px;
word-wrap: break-word;
}
#documentPropertiesOverlay .row > p {
max-width: 225px;
word-wrap: break-word;
}
#documentPropertiesOverlay .buttonRow {
margin-top: 10px;
}
.clearBoth {
clear: both;
}
.fileInput {
background: rgba(255, 255, 255, 1);
color: rgba(0, 0, 0, 1);
margin-top: 5px;
visibility: hidden;
position: fixed;
right: 0;
top: 0;
}
#PDFBug {
background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
border: 1px solid rgba(102, 102, 102, 1);
position: fixed;
top: 32px;
right: 0;
bottom: 0;
font-size: 10px;
padding: 0;
width: 300px;
}
#PDFBug .controls {
background: rgba(238, 238, 238, 1);
border-bottom: 1px solid rgba(102, 102, 102, 1);
padding: 3px;
}
#PDFBug .panels {
bottom: 0;
left: 0;
overflow: auto;
-webkit-overflow-scrolling: touch;
position: absolute;
right: 0;
top: 27px;
}
#PDFBug .panels > div {
padding: 5px;
}
#PDFBug button.active {
font-weight: bold;
}
.debuggerShowText {
background: none repeat scroll 0 0 rgba(255, 255, 0, 1);
color: rgba(0, 0, 255, 1);
}
.debuggerHideText:hover {
background: none repeat scroll 0 0 rgba(255, 255, 0, 1);
}
#PDFBug .stats {
font-family: courier;
font-size: 10px;
white-space: pre;
}
#PDFBug .stats .title {
font-weight: bold;
}
#PDFBug table {
font-size: 10px;
}
#viewer.textLayer-visible .textLayer {
opacity: 1.0;
}
#viewer.textLayer-visible .canvasWrapper {
background-color: rgba(128, 255, 128, 1);
}
#viewer.textLayer-visible .canvasWrapper canvas {
mix-blend-mode: screen;
}
#viewer.textLayer-visible .textLayer > span {
background-color: rgba(255, 255, 0, 0.1);
color: rgba(0, 0, 0, 1);
border: solid 1px rgba(255, 0, 0, 0.5);
box-sizing: border-box;
}
#viewer.textLayer-hover .textLayer > span:hover {
background-color: rgba(255, 255, 255, 1);
color: rgba(0, 0, 0, 1);
}
#viewer.textLayer-shadow .textLayer > span {
background-color: rgba(255, 255, 255, 0.6);
color: rgba(0, 0, 0, 1);
}
/* .grab-to-pan-grab {
cursor: url("../assets/grab.cur"), move !important;
cursor: grab !important;
}
.grab-to-pan-grab *:not(input):not(textarea):not(button):not(select):not(:link) {
cursor: inherit !important;
}
.grab-to-pan-grab:active,
.grab-to-pan-grabbing {
cursor: url("../assets/grabbing.cur"), move !important;
cursor: grabbing !important;
position: fixed;
background: rgba(0, 0, 0, 0);
display: block;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: hidden;
z-index: 50000;
} */
/* should be higher than anything else in PDF.js! */
@page {
margin: 0;
}
#printContainer {
display: none;
}
@media screen and (min-resolution: 1.1dppx) {
/* Rules for Retina screens */
.toolbarButton::before {
transform: scale(0.5);
top: -5px;
}
.secondaryToolbarButton::before {
transform: scale(0.5);
top: -4px;
}
html[dir='ltr'] .toolbarButton::before,
html[dir='rtl'] .toolbarButton::before {
left: -1px;
}
html[dir='ltr'] .secondaryToolbarButton::before {
left: -2px;
}
html[dir='rtl'] .secondaryToolbarButton::before {
left: 186px;
}
.toolbarField.pageNumber.visiblePageIsLoading,
#findInput[data-status="pending"] {
background-image: url(../assets/loading-small@2x.png);
background-size: 16px 17px;
}
.dropdownToolbarButton::after {
transform: scale(0.5);
top: -5px;
content: url(../assets/toolbarButton-menuArrows@2x.png);
}
html[dir='ltr'] .dropdownToolbarButton::after {
right: 4px;
}
html[dir='rtl'] .dropdownToolbarButton::after {
left: 4px;
}
.toolbarButton#sidebarToggle::before {
content: url(../assets/toolbarButton-sidebarToggle@2x.png);
}
html[dir='rtl'] .toolbarButton#sidebarToggle::before {
transform: scale(-0.5, 0.5);
}
.toolbarButton#secondaryToolbarToggle::before {
content: url(../assets/toolbarButton-secondaryToolbarToggle@2x.png);
}
html[dir='rtl'] .toolbarButton#secondaryToolbarToggle::before {
transform: scale(-0.5, 0.5);
}
.toolbarButton.findPrevious::before {
content: url(../assets/findbarButton-previous@2x.png);
}
html[dir='rtl'] .toolbarButton.findPrevious::before {
transform: scale(-0.5, 0.5);
}
.toolbarButton.findNext::before {
content: url(../assets/findbarButton-next@2x.png);
}
html[dir='rtl'] .toolbarButton.findNext::before {
transform: scale(-0.5, 0.5);
}
.toolbarButton.pageUp::before {
content: url(../assets/toolbarButton-pageUp@2x.png);
}
html[dir='rtl'] .toolbarButton.pageUp::before {
transform: scale(-0.5, 0.5);
}
.toolbarButton.pageDown::before {
content: url(../assets/toolbarButton-pageDown@2x.png);
}
html[dir='rtl'] .toolbarButton.pageDown::before {
transform: scale(-0.5, 0.5);
}
.toolbarButton.zoomIn::before {
content: url(../assets/toolbarButton-zoomIn@2x.png);
}
.toolbarButton.zoomOut::before {
content: url(../assets/toolbarButton-zoomOut@2x.png);
}
.toolbarButton.presentationMode::before,
.secondaryToolbarButton.presentationMode::before {
content: url(../assets/toolbarButton-presentationMode@2x.png);
}
.toolbarButton.print::before,
.secondaryToolbarButton.print::before {
content: url(../assets/toolbarButton-print@2x.png);
}
.toolbarButton.openFile::before,
.secondaryToolbarButton.openFile::before {
content: url(../assets/toolbarButton-openFile@2x.png);
}
.toolbarButton.download::before,
.secondaryToolbarButton.download::before {
content: url(../assets/toolbarButton-download@2x.png);
}
.toolbarButton.bookmark::before,
.secondaryToolbarButton.bookmark::before {
content: url(../assets/toolbarButton-bookmark@2x.png);
}
#viewThumbnail.toolbarButton::before {
content: url(../assets/toolbarButton-viewThumbnail@2x.png);
}
#viewOutline.toolbarButton::before {
content: url(../assets/toolbarButton-viewOutline@2x.png);
}
html[dir="rtl"] #viewOutline.toolbarButton::before {
transform: scale(-0.5, 0.5);
}
#viewAttachments.toolbarButton::before {
content: url(../assets/toolbarButton-viewAttachments@2x.png);
}
#viewFind.toolbarButton::before {
content: url(../assets/toolbarButton-search@2x.png);
}
.secondaryToolbarButton.firstPage::before {
content: url(../assets/secondaryToolbarButton-firstPage@2x.png);
}
.secondaryToolbarButton.lastPage::before {
content: url(../assets/secondaryToolbarButton-lastPage@2x.png);
}
.secondaryToolbarButton.rotateCcw::before {
content: url(../assets/secondaryToolbarButton-rotateCcw@2x.png);
}
.secondaryToolbarButton.rotateCw::before {
content: url(../assets/secondaryToolbarButton-rotateCw@2x.png);
}
.secondaryToolbarButton.selectTool::before {
content: url(../assets/secondaryToolbarButton-selectTool@2x.png);
}
.secondaryToolbarButton.handTool::before {
content: url(../assets/secondaryToolbarButton-handTool@2x.png);
}
.secondaryToolbarButton.scrollVertical::before {
content: url(../assets/secondaryToolbarButton-scrollVertical@2x.png);
}
.secondaryToolbarButton.scrollHorizontal::before {
content: url(../assets/secondaryToolbarButton-scrollHorizontal@2x.png);
}
.secondaryToolbarButton.scrollWrapped::before {
content: url(../assets/secondaryToolbarButton-scrollWrapped@2x.png);
}
.secondaryToolbarButton.spreadNone::before {
content: url(../assets/secondaryToolbarButton-spreadNone@2x.png);
}
.secondaryToolbarButton.spreadOdd::before {
content: url(../assets/secondaryToolbarButton-spreadOdd@2x.png);
}
.secondaryToolbarButton.spreadEven::before {
content: url(../assets/secondaryToolbarButton-spreadEven@2x.png);
}
.secondaryToolbarButton.documentProperties::before {
content: url(../assets/secondaryToolbarButton-documentProperties@2x.png);
}
.outlineItemToggler::before {
transform: scale(0.5);
top: -1px;
content: url(../assets/treeitem-expanded@2x.png);
}
.outlineItemToggler.outlineItemsHidden::before {
content: url(../assets/treeitem-collapsed@2x.png);
}
html[dir='rtl'] .outlineItemToggler.outlineItemsHidden::before {
transform: scale(-0.5, 0.5);
}
html[dir='ltr'] .outlineItemToggler::before {
right: 0;
}
html[dir='rtl'] .outlineItemToggler::before {
left: 0;
}
}
@media print {
/* General rules for printing. */
body {
background: rgba(0, 0, 0, 0) none;
}
/* Rules for browsers that don't support mozPrintCallback. */
#sidebarContainer, #secondaryToolbar, .toolbar, #loadingBox, #errorWrapper, .textLayer {
display: none;
}
#viewerContainer {
overflow: visible;
}
#mainContainer, #viewerContainer, .page, .page canvas {
position: static;
padding: 0;
margin: 0;
}
.page {
float: left;
display: none;
border: none;
box-shadow: none;
background-clip: content-box;
background-color: rgba(255, 255, 255, 1);
}
.page[data-loaded] {
display: block;
}
.fileInput {
display: none;
}
/* Rules for browsers that support PDF.js printing */
body[data-pdfjsprinting] #outerContainer {
display: none;
}
body[data-pdfjsprinting] #printContainer {
display: block;
}
#printContainer {
height: 100%;
}
/* wrapper around (scaled) print canvas elements */
#printContainer > div {
position: relative;
top: 0;
left: 0;
width: 1px;
height: 1px;
overflow: visible;
page-break-after: always;
page-break-inside: avoid;
}
#printContainer canvas,
#printContainer img {
display: block;
}
}
.visibleLargeView,
.visibleMediumView,
.visibleSmallView {
display: none;
}
@media all and (max-width: 900px) {
#toolbarViewerMiddle {
display: table;
margin: auto;
left: auto;
position: inherit;
transform: none;
}
}
@media all and (max-width: 840px) {
#sidebarContent {
background-color: rgba(0, 0, 0, 0.7);
}
html[dir='ltr'] #outerContainer.sidebarOpen #viewerContainer {
left: 0px !important;
}
html[dir='rtl'] #outerContainer.sidebarOpen #viewerContainer {
right: 0px !important;
}
#outerContainer .hiddenLargeView,
#outerContainer .hiddenMediumView {
display: inherit;
}
#outerContainer .visibleLargeView,
#outerContainer .visibleMediumView {
display: none;
}
}
@media all and (max-width: 770px) {
#outerContainer .hiddenLargeView {
display: none;
}
#outerContainer .visibleLargeView {
display: inherit;
}
}
@media all and (max-width: 700px) {
#outerContainer .hiddenMediumView {
display: none;
}
#outerContainer .visibleMediumView {
display: inherit;
}
}
@media all and (max-width: 640px) {
.hiddenSmallView, .hiddenSmallView * {
display: none;
}
.visibleSmallView {
display: inherit;
}
.toolbarButtonSpacer {
width: 0;
}
html[dir='ltr'] .findbar {
left: 38px;
}
html[dir='rtl'] .findbar {
right: 38px;
}
}
@media all and (max-width: 535px) {
#scaleSelectContainer {
display: none;
}
}
\ No newline at end of file
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _vue = _interopRequireDefault(require("vue"));
var _vueRouter = _interopRequireDefault(require("vue-router"));
var _Home = _interopRequireDefault(require("../views/Home.vue"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
_vue["default"].use(_vueRouter["default"]);
var routes = [{
path: "/",
name: "Home",
component: _Home["default"]
}, {
path: "/about",
name: "About",
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: function component() {
return Promise.resolve().then(function () {
return _interopRequireWildcard(require("../views/About.vue"));
});
}
}];
var router = new _vueRouter["default"]({
routes: routes
});
var _default = router;
exports["default"] = _default;
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment