update upload page style

This commit is contained in:
daniel-j
2023-12-06 17:23:57 +01:00
parent 093ff6f209
commit 1545e6ebcf
3 changed files with 23 additions and 11 deletions

View File

@@ -4,7 +4,7 @@
<title>Send to Kobo/Kindle</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="/style.css?n"/>
<link rel="stylesheet" type="text/css" href="/style.css?o"/>
</head>
<body>

View File

@@ -30,7 +30,7 @@ h1 {
.right {
text-align: right;
}
#keygen, #downloadlink {
#keygen, #downloadlink, #choosebtn, input[type="submit"] {
background: #CCC;
border: none;
color: black;
@@ -42,13 +42,16 @@ h1 {
font-size: 1.2em;
margin: 0 0.5em;
vertical-align: middle;
cursor: pointer;
font-weight: normal;
}
#keygen {
margin-left: 1em;
margin-right: -2em;
padding: 1em;
}
#keygen:focus {
#keygen:focus, #downloadlink:focus, #choosebtn:focus, input[type="submit"]:focus,
#keygen:active, #downloadlink:active, #choosebtn:active, input[type="submit"]:active {
background: black;
color: white;
}
@@ -92,10 +95,20 @@ h1 {
background-color: #FDD;
border: 1px solid #F77;
}
td.right {
td {
padding: 10px;
}
td.aligntop {
vertical-align: top;
}
#fileinput {
display: none;
}
#fileinfo {
font-size: 0.9em;
font-style: italic;
width: 17em;
}

View File

@@ -4,7 +4,7 @@
<title>Send to Kobo/Kindle</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="/style.css?n"/>
<link rel="stylesheet" type="text/css" href="/style.css?o"/>
</head>
<body>
@@ -13,11 +13,10 @@
<form action="/upload" method="post" enctype="multipart/form-data">
<table style="margin: 0 auto;" cellpadding=0 cellspacing=0>
<tr><td class="right"><label for="keyinput">Unique key</label></td><td><input type="text" name="key" id="keyinput" autocomplete="off" pattern="...." placeholder="" required style="text-transform: uppercase;" maxlength=4/></td></tr>
<tr><td class="right"><label for="fileinput">EPUB/MOBI file</label></td><td><input type="file" name="file" id="fileinput" accept=".txt,.epub,.mobi,.pdf,.cbz,.cbr,application/epub+zip,application/x-mobipocket-ebook,application/pdf,application/vnd.comicbook+zip,application/vnd.comicbook-rar" required /></td></tr>
<tr><td></td><td id="fileinfo"></td></tr>
<tr><td class="right"><label for="kepubify">Kepubify</label></td><td><input type="checkbox" name="kepubify" id="kepubify" checked /></td></tr>
<tr><td></td><td><input type="submit" value="Upload and send" /></td></tr>
<tr><td class="right"><label for="keyinput"><strong>Unique key</strong></label></td><td><input type="text" name="key" id="keyinput" autocomplete="off" pattern="...." placeholder="" required style="text-transform: uppercase;" maxlength=4/></td></tr>
<tr><td class="right aligntop"><label for="fileinput"><strong>Ebook file</strong></label><br/><em>EPUB, MOBI, PDF,<br/>TXT, CBZ, CBR</em></td><td class="aligntop"><label for="fileinput" id="choosebtn">Choose file</label><input type="file" name="file" id="fileinput" accept=".txt,.epub,.mobi,.pdf,.cbz,.cbr,application/epub+zip,application/x-mobipocket-ebook,application/pdf,application/vnd.comicbook+zip,application/vnd.comicbook-rar" required /><br/><br/><div id="fileinfo"></div></td></tr>
<tr><td class="right"><label for="kepubify"><strong>Kepubify</strong><br/><em>Kobo only</em></label></td><td><input type="checkbox" name="kepubify" id="kepubify" checked /></td></tr>
<tr class="center"><td colspan="2"><input type="submit" value="Upload and send" /></td></tr>
</table>
<div id="uploadstatus"></div>
</form>
@@ -116,7 +115,7 @@ function fileinputChange () {
return
}
fileinfo.textContent = Math.ceil(fileinput.files[0].size / 1024) + ' kB'
fileinfo.innerHTML = filename + "<br/>Filesize: " + Math.ceil(fileinput.files[0].size / 1024) + ' kB'
}
fileinput.addEventListener('change', fileinputChange, false)
fileinputChange()