Goyslop/4chan-x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Simplify QR's file/submit html and css.

Browse Source
This commit is contained in:
Mayhem 2014-02-12 15:07:38 +01:00
parent a8161615ce
commit 00f08c726e
2 changed files with 16 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
css/style.css
View File

@ -925,23 +925,11 @@ a.remove {
height: 57px; height: 57px;
width: 300px; width: 300px;
} }
#file-n-submit-container {
position: relative;
}
#file-n-submit { #file-n-submit {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: flex; display: flex;
align-items: center; align-items: center;
} }
#file-n-submit-container input[type='file'] { #file-n-submit input {
/* Keep it to set an appropriate height to the container. */
visibility: hidden;
}
#file-n-submit-container input {
margin: 0; margin: 0;
} }
#file-n-submit input[type='submit'] { #file-n-submit input[type='submit'] {
@ -958,8 +946,9 @@ a.remove {
#qr-no-file, #qr-no-file,
#qr-filename, #qr-filename,
#qr-filesize, #qr-filesize,
#qr-filerm,
#qr-file-spoiler { #qr-file-spoiler {
margin: 0 2px !important; margin: 0 1px !important;
} }
#qr-no-file { #qr-no-file {
cursor: default; cursor: default;
@ -970,17 +959,19 @@ a.remove {
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
background: none; background: none;
border: none !important; border: none;
color: inherit; color: inherit;
font: inherit; font: inherit;
flex: 1; flex: 1;
width: 0;
padding: 0;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
#qr-filesize { #qr-filesize {
font-size: .8em; font-size: .8em;
} }
#qr-filesize::before { #qr-filesize::before {
content: " ("; content: "(";
} }
#qr-filesize::after { #qr-filesize::after {
content: ")"; content: ")";

20
html/Posting/QR.html
View File

@ -21,17 +21,15 @@
<textarea data-name="com" placeholder="Comment" class="field"></textarea> <textarea data-name="com" placeholder="Comment" class="field"></textarea>
<span id="char-count"></span> <span id="char-count"></span>
</div> </div>
<div id="file-n-submit-container"> <div id="file-n-submit">
<input type="file" multiple> <input type="file" hidden multiple>
<div id="file-n-submit"> <input type="submit">
<input type="submit"> <input type="button" id="qr-file-button" value="Choose files">
<input type="button" id="qr-file-button" value="Choose files"> <span id="qr-no-file">No selected file</span>
<span id="qr-no-file">No selected file</span> <input id="qr-filename" data-name="filename" spellcheck="false">
<input id="qr-filename" data-name="filename" spellcheck="false"> <span id="qr-filesize"></span>
<span id="qr-filesize"></span> <a href="javascript:;" id="qr-filerm" class="fa fa-times-circle" title="Remove file"></a>
<a href="javascript:;" id="qr-filerm" class="fa fa-times-circle" title="Remove file"></a> <input type="checkbox" id="qr-file-spoiler" title="Spoiler image">
<input type="checkbox" id="qr-file-spoiler" title="Spoiler image">
</div>
</div> </div>
</form> </form>
<datalist id="list-name"></datalist> <datalist id="list-name"></datalist>