Edit for accessibility

This commit is contained in:
BoHung Chiu 2021-06-17 17:48:05 +08:00
parent 2371922148
commit e9554417fa
3 changed files with 26 additions and 23 deletions

View File

@ -118,7 +118,7 @@
background-color: rgba(0, 54, 255, 0.13); background-color: rgba(0, 54, 255, 0.13);
border: 1px solid transparent; border: 1px solid transparent;
box-sizing: border-box; box-sizing: border-box;
font-size: 9px; font-size: 0.5625em;
height: 100%; height: 100%;
margin: 0; margin: 0;
padding: 0 3px; padding: 0 3px;
@ -136,7 +136,7 @@
.annotationLayer .textWidgetAnnotation textarea { .annotationLayer .textWidgetAnnotation textarea {
font: message-box; font: message-box;
font-size: 9px; font-size: 0.5625em;
resize: none; resize: none;
} }
@ -239,12 +239,12 @@
margin-left: 5px; margin-left: 5px;
cursor: pointer; cursor: pointer;
font: message-box; font: message-box;
font-size: 9px; font-size: 0.5625em;
word-wrap: break-word; word-wrap: break-word;
} }
.annotationLayer .popup > * { .annotationLayer .popup > * {
font-size: 9px; font-size: 0.5625em;
} }
.annotationLayer .popup h1 { .annotationLayer .popup h1 {
@ -421,7 +421,7 @@ html {
height: 100%; height: 100%;
width: 100%; width: 100%;
/* Font size is needed to make the activity bar the correct size. */ /* Font size is needed to make the activity bar the correct size. */
font-size: 10px; font-size: 0.625em;
} }
body { body {
@ -812,7 +812,7 @@ html[dir='rtl'] #toolbarContainer, .findbar, .secondaryToolbar {
padding: 0px 6px 0px 6px; padding: 0px 6px 0px 6px;
margin: 4px 2px 4px 2px; margin: 4px 2px 4px 2px;
color: rgba(217, 217, 217, 1); color: rgba(217, 217, 217, 1);
font-size: 12px; font-size: 0.75em;
line-height: 14px; line-height: 14px;
text-align: left; text-align: left;
cursor: default; cursor: default;
@ -1121,7 +1121,7 @@ html[dir='rtl'] .splitToolbarButtonSeparator {
border: 1px solid rgba(0, 0, 0, 0); border: 1px solid rgba(0, 0, 0, 0);
border-radius: 2px; border-radius: 2px;
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
font-size: 12px; font-size: 0.75em;
line-height: 14px; line-height: 14px;
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
@ -1215,7 +1215,7 @@ html[dir='rtl'] .dropdownToolbarButton::after {
.dropdownToolbarButton > select { .dropdownToolbarButton > select {
width: 162px; width: 162px;
height: 23px; height: 23px;
font-size: 12px; font-size: 0.75em;
color: rgba(242, 242, 242, 1); color: rgba(242, 242, 242, 1);
margin: 0; margin: 0;
padding: 3px 2px 2px; padding: 3px 2px 2px;
@ -1535,7 +1535,7 @@ html[dir='rtl'] .verticalToolbarSeparator {
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05) inset, box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05) inset,
0 1px 0 rgba(255, 255, 255, 0.05); 0 1px 0 rgba(255, 255, 255, 0.05);
color: rgba(242, 242, 242, 1); color: rgba(242, 242, 242, 1);
font-size: 12px; font-size: 0.75em;
line-height: 14px; line-height: 14px;
outline-style: none; outline-style: none;
} }
@ -1581,7 +1581,7 @@ html[dir='rtl'] .verticalToolbarSeparator {
border: 1px solid rgba(0, 0, 0, 0); border: 1px solid rgba(0, 0, 0, 0);
border-radius: 2px; border-radius: 2px;
color: rgba(217, 217, 217, 1); color: rgba(217, 217, 217, 1);
font-size: 12px; font-size: 0.75em;
line-height: 14px; line-height: 14px;
text-align: left; text-align: left;
-webkit-user-select: none; -webkit-user-select: none;
@ -1718,7 +1718,7 @@ html[dir='rtl'] .outlineItem > .outlineItems {
margin-bottom: 1px; margin-bottom: 1px;
border-radius: 2px; border-radius: 2px;
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
font-size: 13px; font-size: 0.8125em;
line-height: 15px; line-height: 15px;
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
@ -1811,7 +1811,7 @@ html[dir='rtl'] .outlineItemToggler::before {
} }
.noResults { .noResults {
font-size: 12px; font-size: 0.75em;
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
font-style: italic; font-style: italic;
cursor: default; cursor: default;
@ -1887,7 +1887,7 @@ html[dir='rtl'] .outlineItemToggler::before {
padding: 15px; padding: 15px;
border-spacing: 4px; border-spacing: 4px;
color: rgba(217, 217, 217, 1); color: rgba(217, 217, 217, 1);
font-size: 12px; font-size: 0.75em;
line-height: 14px; line-height: 14px;
background-color: rgba(71, 71, 71, 1); /* fallback */ background-color: rgba(71, 71, 71, 1); /* fallback */
background-image: url(images/texture.png), background-image: url(images/texture.png),
@ -1981,7 +1981,7 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * {
top: 32px; top: 32px;
right: 0; right: 0;
bottom: 0; bottom: 0;
font-size: 10px; font-size: 0.625em;
padding: 0; padding: 0;
width: 300px; width: 300px;
} }
@ -2014,14 +2014,14 @@ html[dir='rtl'] #documentPropertiesOverlay .row > * {
} }
#PDFBug .stats { #PDFBug .stats {
font-family: courier; font-family: courier;
font-size: 10px; font-size: 0.625em;
white-space: pre; white-space: pre;
} }
#PDFBug .stats .title { #PDFBug .stats .title {
font-weight: bold; font-weight: bold;
} }
#PDFBug table { #PDFBug table {
font-size: 10px; font-size: 0.625em;
} }
#viewer.textLayer-visible .textLayer { #viewer.textLayer-visible .textLayer {

View File

@ -38,6 +38,7 @@ See https://github.com/adobe-type-tools/cmap-resources
</head> </head>
<body tabindex="1" class="loadingInProgress" data-url="<%=@url%>"> <body tabindex="1" class="loadingInProgress" data-url="<%=@url%>">
<h1 style="display: none;"><%=@filename%></h1>
<div id="outerContainer"> <div id="outerContainer">
<div id="sidebarContainer"> <div id="sidebarContainer">
@ -68,6 +69,7 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="mainContainer"> <div id="mainContainer">
<div class="findbar hidden doorHanger" id="findbar"> <div class="findbar hidden doorHanger" id="findbar">
<div id="findbarInputContainer"> <div id="findbarInputContainer">
<label style="background: transparent;border: none;display: none;" for="findInput">Find in document…</label>
<input id="findInput" class="toolbarField" title="Find" placeholder="Find in document…" tabindex="91" data-l10n-id="find_input"> <input id="findInput" class="toolbarField" title="Find" placeholder="Find in document…" tabindex="91" data-l10n-id="find_input">
<div class="splitToolbarButton"> <div class="splitToolbarButton">
<button id="findPrevious" class="toolbarButton findPrevious" title="Find the previous occurrence of the phrase" tabindex="92" data-l10n-id="find_previous"> <button id="findPrevious" class="toolbarButton findPrevious" title="Find the previous occurrence of the phrase" tabindex="92" data-l10n-id="find_previous">
@ -81,13 +83,13 @@ See https://github.com/adobe-type-tools/cmap-resources
</div> </div>
<div id="findbarOptionsOneContainer"> <div id="findbarOptionsOneContainer">
<input type="checkbox" id="findHighlightAll" class="toolbarField" tabindex="94"> <input type="checkbox" id="findHighlightAll" class="toolbarField" tabindex="94" title="Highlight all">
<label for="findHighlightAll" class="toolbarLabel" data-l10n-id="find_highlight">Highlight all</label> <label for="findHighlightAll" class="toolbarLabel" data-l10n-id="find_highlight">Highlight all</label>
<input type="checkbox" id="findMatchCase" class="toolbarField" tabindex="95"> <input type="checkbox" id="findMatchCase" class="toolbarField" tabindex="95" title="Match case">
<label for="findMatchCase" class="toolbarLabel" data-l10n-id="find_match_case_label">Match case</label> <label for="findMatchCase" class="toolbarLabel" data-l10n-id="find_match_case_label">Match case</label>
</div> </div>
<div id="findbarOptionsTwoContainer"> <div id="findbarOptionsTwoContainer">
<input type="checkbox" id="findEntireWord" class="toolbarField" tabindex="96"> <input type="checkbox" id="findEntireWord" class="toolbarField" tabindex="96" title="Whole words">
<label for="findEntireWord" class="toolbarLabel" data-l10n-id="find_entire_word_label">Whole words</label> <label for="findEntireWord" class="toolbarLabel" data-l10n-id="find_entire_word_label">Whole words</label>
<span id="findResultsCount" class="toolbarLabel hidden"></span> <span id="findResultsCount" class="toolbarLabel hidden"></span>
</div> </div>
@ -198,6 +200,7 @@ See https://github.com/adobe-type-tools/cmap-resources
<span data-l10n-id="next_label">Next</span> <span data-l10n-id="next_label">Next</span>
</button> </button>
</div> </div>
<label style="display: none;" for="pageNumber">PageNumber</label>
<input type="number" id="pageNumber" class="toolbarField pageNumber" title="Page" value="1" size="4" min="1" tabindex="15" data-l10n-id="page"> <input type="number" id="pageNumber" class="toolbarField pageNumber" title="Page" value="1" size="4" min="1" tabindex="15" data-l10n-id="page">
<span id="numPages" class="toolbarLabel"></span> <span id="numPages" class="toolbarLabel"></span>
</div> </div>
@ -296,7 +299,7 @@ See https://github.com/adobe-type-tools/cmap-resources
</button> </button>
</div> </div>
<div class="clearBoth"></div> <div class="clearBoth"></div>
<textarea id="errorMoreInfo" hidden='true' readonly="readonly"></textarea> <textarea id="errorMoreInfo" hidden='true' readonly="readonly" title="Error More Info"></textarea>
</div> </div>
</div> <!-- mainContainer --> </div> <!-- mainContainer -->
@ -304,10 +307,10 @@ See https://github.com/adobe-type-tools/cmap-resources
<div id="passwordOverlay" class="container hidden"> <div id="passwordOverlay" class="container hidden">
<div class="dialog"> <div class="dialog">
<div class="row"> <div class="row">
<p id="passwordText" data-l10n-id="password_label">Enter the password to open this PDF file:</p> <label id="passwordText" data-l10n-id="password_label" for="password">Enter the password to open this PDF file:</label>
</div> </div>
<div class="row"> <div class="row">
<input type="password" id="password" class="toolbarField"> <input type="password" id="password" class="toolbarField" title="PDF password">
</div> </div>
<div class="buttonRow"> <div class="buttonRow">
<button id="passwordCancel" class="overlayButton"><span data-l10n-id="password_cancel">Cancel</span></button> <button id="passwordCancel" class="overlayButton"><span data-l10n-id="password_cancel">Cancel</span></button>

View File

@ -8,7 +8,7 @@
<link href="/assets/archive/download_file.css" rel="stylesheet" media="all"> <link href="/assets/archive/download_file.css" rel="stylesheet" media="all">
</head> </head>
<body> <body>
<h3 style="display: none;"><%=@filename%></h3> <h1 style="display: none;"><%=@filename%></h1>
<% if @ext != "png" && @ext != "jpg" && @ext != "bmp" %> <% if @ext != "png" && @ext != "jpg" && @ext != "bmp" %>
<object data="<%=@url%>" height="100%" type="application/<%=@ext%>" width="100%"> <object data="<%=@url%>" height="100%" type="application/<%=@ext%>" width="100%">
<iframe height="100%" src="<%=@url%>" title="<%=@filename%>" width="100%"></iframe> <iframe height="100%" src="<%=@url%>" title="<%=@filename%>" width="100%"></iframe>