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

Merge pull request #1703 from yurydelendik/small-ui

Browse Source 
Adds styles for small screens
This commit is contained in:
Artur Adib 2012-05-17 13:09:42 -07:00
commit ba03501739
2 changed files with 46 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
web/viewer.css
View File

@ -927,3 +927,47 @@ canvas {
#PDFBug table { #PDFBug table {
font-size: 10px; font-size: 10px;
} }
@media all and (max-width: 770px) {
#scaleSelectContainer, #fileInput, #pageNumberLabel {
display: none;
}
#sidebarContainer {
top: 33px;
z-index: 100;
}
#sidebarContent {
top: 33px;
background-color: hsla(0,0%,0%,.7);
}
#thumbnailView, #outlineView {
top: 66px;
}
html[dir='ltr'] #outerContainer.sidebarOpen > #mainContainer {
left: 0px;
}
html[dir='rtl'] #outerContainer.sidebarOpen > #mainContainer {
right: 0px;
}
#pageNumber {
width: 30px;
}
}
@media all and (max-width: 500px) {
#viewBookmark {
display: none;
}
html[dir='ltr'] .outerCenter {
float: left;
left: 180px;
}
html[dir='rtl'] .outerCenter {
float: right;
right: 180px;
}
}

4
web/viewer.html
View File

@ -81,7 +81,7 @@
<span data-l10n-id="next_label">Next</span> <span data-l10n-id="next_label">Next</span>
</button> </button>
</div> </div>
<label class="toolbarLabel" for="pageNumber" data-l10n-id="page_label">Page: </label> <label id="pageNumberLabel" class="toolbarLabel" for="pageNumber" data-l10n-id="page_label">Page: </label>
<input type="number" id="pageNumber" class="toolbarField pageNumber" onchange="PDFView.page = this.value;" value="1" size="4" min="1" tabindex="6"> <input type="number" id="pageNumber" class="toolbarField pageNumber" onchange="PDFView.page = this.value;" value="1" size="4" min="1" tabindex="6">
</input> </input>
<span id="numPages" class="toolbarLabel"></span> <span id="numPages" class="toolbarLabel"></span>
@ -119,7 +119,7 @@
<span data-l10n-id="zoom_in_label">Zoom In</span> <span data-l10n-id="zoom_in_label">Zoom In</span>
</button> </button>
</div> </div>
<span class="dropdownToolbarButton"> <span id="scaleSelectContainer" class="dropdownToolbarButton">
<select id="scaleSelect" onchange="PDFView.parseScale(this.value);" title="Zoom" oncontextmenu="return false;" tabindex="9" data-l10n-id="zoom"> <select id="scaleSelect" onchange="PDFView.parseScale(this.value);" title="Zoom" oncontextmenu="return false;" tabindex="9" data-l10n-id="zoom">
<option id="pageAutoOption" value="auto" selected="selected" data-l10n-id="page_scale_auto">Automatic Zoom</option> <option id="pageAutoOption" value="auto" selected="selected" data-l10n-id="page_scale_auto">Automatic Zoom</option>
<option id="pageActualOption" value="page-actual" data-l10n-id="page_scale_actual">Actual Size</option> <option id="pageActualOption" value="page-actual" data-l10n-id="page_scale_actual">Actual Size</option>