89 lines
3.6 KiB
HTML
89 lines
3.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>upload.jeffemmett.com</title>
|
|
<link rel="stylesheet" href="/static/style.css?v=5">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>upload</h1>
|
|
<p class="subtitle">Simple file sharing. Up to 5 GB.</p>
|
|
|
|
<div id="dropzone" class="dropzone">
|
|
<div class="dropzone-content">
|
|
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
|
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/>
|
|
<polyline points="17 8 12 3 7 8"/>
|
|
<line x1="12" y1="3" x2="12" y2="15"/>
|
|
</svg>
|
|
<p>Drop files here or <label for="file-input" class="link">browse</label></p>
|
|
<input type="file" id="file-input" hidden multiple>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="file-list" class="file-list hidden"></div>
|
|
|
|
<div id="options" class="options hidden">
|
|
<div id="slug-group" class="option-group">
|
|
<label for="slug">Custom URL</label>
|
|
<div class="slug-input">
|
|
<span class="slug-prefix">/f/</span>
|
|
<input type="text" id="slug" placeholder="my-file" pattern="[a-zA-Z0-9][a-zA-Z0-9.\-_]*" maxlength="64">
|
|
</div>
|
|
</div>
|
|
<div class="option-group">
|
|
<label for="expires">Expires in</label>
|
|
<select id="expires">
|
|
<option value="">Never</option>
|
|
<option value="1h">1 hour</option>
|
|
<option value="1d">1 day</option>
|
|
<option value="7d">7 days</option>
|
|
<option value="30d">30 days</option>
|
|
</select>
|
|
</div>
|
|
<div class="option-group">
|
|
<label for="password">Password</label>
|
|
<input type="password" id="password" placeholder="Optional">
|
|
</div>
|
|
<button id="upload-btn" class="btn">Upload</button>
|
|
</div>
|
|
|
|
<div id="progress-section" class="hidden">
|
|
<div id="progress-overall" class="progress-overall"></div>
|
|
<div class="file-name" id="progress-filename"></div>
|
|
<div class="progress-bar">
|
|
<div class="progress-fill" id="progress-fill"></div>
|
|
</div>
|
|
<div class="progress-text" id="progress-text">0%</div>
|
|
</div>
|
|
|
|
<div id="result" class="result hidden">
|
|
<div class="result-success">
|
|
<p id="result-heading">Uploaded!</p>
|
|
<div id="result-single">
|
|
<div class="result-url">
|
|
<input type="text" id="result-url" readonly>
|
|
<button id="copy-btn" class="btn btn-small">Copy</button>
|
|
</div>
|
|
<div id="result-delete" class="result-meta"></div>
|
|
<div id="result-expiry" class="result-meta"></div>
|
|
</div>
|
|
<div id="result-multi" class="hidden">
|
|
<div id="result-list" class="result-list"></div>
|
|
<button id="copy-all-btn" class="btn btn-small" style="margin-top: 0.75rem;">Copy all URLs</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="error" class="error hidden"></div>
|
|
|
|
<footer>
|
|
<a href="/cli">CLI tool</a>
|
|
</footer>
|
|
</div>
|
|
<script src="/static/upload.js?v=3"></script>
|
|
</body>
|
|
</html>
|