mirror of https://github.com/gorhill/uBlock.git
input[type="file"].click() didn't work in Safari
Click couldn't be initiated with JavaScript in Safari if the input was hidden with display: none. Using visibility: hidden or opacity: 0 solves the problem. Alternative solution would be to hide (opacity: 0) the input and slide it (position: absolute; top: 0; left: 0; width: 100%; height: 100%) over the button, which would work in all browsers, and wouldn't require JavaScript.
This commit is contained in:
parent
54749b31fb
commit
99d8f431d5
|
@ -13,7 +13,7 @@
|
|||
<div>
|
||||
<p data-i18n="1pFormatHint"></p>
|
||||
<p><button id="importUserFiltersFromFile" data-i18n="1pImport"></button>   <button id="exportUserFiltersToFile" data-i18n="1pExport"></button></p>
|
||||
<input id="importFilePicker" type="file" accept="text/plain" style="display:none;">
|
||||
<input id="importFilePicker" type="file" accept="text/plain" class="hiddenFileInput">
|
||||
<textarea class="userFilters" id="userFilters" dir="auto" spellcheck="false"></textarea>
|
||||
<p><button id="userFiltersApply" disabled="true" data-i18n="1pApplyChanges"></button></p>
|
||||
</div>
|
||||
|
|
|
@ -26,7 +26,7 @@
|
|||
<div style="margin:1em 0 0 0;">
|
||||
<p><button type="button" id="export" data-i18n="aboutBackupDataButton"></button>
|
||||
<button type="button" id="import" data-i18n="aboutRestoreDataButton"></button>
|
||||
<input id="restoreFilePicker" type="file" accept="text/plain" style="display:none;">
|
||||
<input id="restoreFilePicker" type="file" accept="text/plain" class="hiddenFileInput">
|
||||
<p>
|
||||
<p><button type="button" id="reset" data-i18n="aboutResetDataButton"></button>
|
||||
</div>
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
@font-face {
|
||||
font-family: 'FontAwesome';
|
||||
src: url('fonts/fontawesome-webfont.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
font-family: 'FontAwesome';
|
||||
src: url('fonts/fontawesome-webfont.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
.fa {
|
||||
font-family: FontAwesome;
|
||||
font-style: normal;
|
||||
|
@ -64,3 +64,9 @@ body[dir=rtl] [data-tip][data-tip-anchor="top"]:hover:after {
|
|||
85% { opacity: 0; }
|
||||
100% { opacity: 1; }
|
||||
}
|
||||
|
||||
.hiddenFileInput {
|
||||
visibility: hidden;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
<div>
|
||||
<p data-i18n="whitelistPrompt"></p>
|
||||
<p><button id="importWhitelistFromFile" data-i18n="whitelistImport"></button>   <button id="exportWhitelistToFile" data-i18n="whitelistExport"></button></p>
|
||||
<input id="importFilePicker" type="file" accept="text/plain" style="display:none;">
|
||||
<input id="importFilePicker" type="file" accept="text/plain" class="hiddenFileInput">
|
||||
<textarea id="whitelist" dir="auto" spellcheck="false"></textarea>
|
||||
<p><button id="whitelistApply" type="button" disabled="true" data-i18n="whitelistApply"></button></p>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue