fen
a4118b92a9
Fixed-position Top/Bottom pills appear only when content exceeds 2x viewport height (window scroll on paste view, textarea scroll on /new). New static/jump.js drives them; markup added to paste.html and new.html.
99 lines
5.5 KiB
HTML
99 lines
5.5 KiB
HTML
{{template "head" .}}
|
|
{{template "topbar" .}}
|
|
<div class="deck">
|
|
<div class="pane-l-col">
|
|
<div class="float pane-l-head">
|
|
<div class="editor-head">
|
|
<div class="editor-head-title">
|
|
<input id="title" placeholder="Title">
|
|
</div>
|
|
<div class="editor-head-settings">
|
|
<select id="language">
|
|
<option value="">auto</option>
|
|
<option>go</option><option>python</option><option>javascript</option><option>typescript</option>
|
|
<option>rust</option><option>c</option><option>cpp</option><option>java</option><option>csharp</option>
|
|
<option>bash</option><option>sql</option><option>yaml</option><option>json</option>
|
|
<option>html</option><option>css</option><option>xml</option><option>php</option>
|
|
<option>ruby</option><option>perl</option><option>lua</option><option>dockerfile</option>
|
|
<option>toml</option><option>ini</option><option>diff</option>
|
|
<option>markdown</option><option>text</option>
|
|
</select>
|
|
<button class="btn btn-icon" id="reguess" title="Re-detect language" type="button"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.64-6.36"/><polyline points="21 3 21 9 15 9"/></svg></button>
|
|
<button type="button" class="btn btn-icon wrap-toggle" id="wrap-toggle" title="Toggle line wrap" aria-pressed="false">Wrap</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="float editor-wrap">
|
|
<div class="gutter" id="gutter">1</div>
|
|
<textarea class="editor" id="content" placeholder="Paste your code, text, or notes here…" spellcheck="false"></textarea>
|
|
<img id="file-preview" class="file-preview hidden" alt="File preview">
|
|
</div>
|
|
<div class="actionbar">
|
|
<span class="hint">Ctrl+Enter to create</span>
|
|
<div class="spacer spacer-flex"></div>
|
|
<button class="btn" id="create">Create</button>
|
|
</div>
|
|
<div class="jumpnav hidden" id="jumpnav" data-jump-scroll="#content">
|
|
<button type="button" class="btn jump-btn" data-jump="top">Top</button>
|
|
<button type="button" class="btn jump-btn" data-jump="bottom">Bottom</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pane-r">
|
|
<div class="float side-section">
|
|
<h3>Expiry</h3>
|
|
<div class="seg">
|
|
<label><input type="radio" name="exp" value=""> Never</label>
|
|
<label><input type="radio" name="exp" value="1h"> 1 hour</label>
|
|
<label><input type="radio" name="exp" value="24h"> 1 day</label>
|
|
<label><input type="radio" name="exp" value="168h" checked> 1 week</label>
|
|
<label><input type="radio" name="exp" value="720h"> 30 days</label>
|
|
<label><input type="radio" name="exp" value="custom"> Custom</label>
|
|
</div>
|
|
<div class="pw-row submenu hidden" id="customexp-row">
|
|
<div class="exp-group">
|
|
<input type="number" class="num-input" id="expnum" min="1" placeholder="90" aria-label="Custom expiry amount">
|
|
<select id="expunit" class="unit-select">
|
|
<option value="m">minutes</option>
|
|
<option value="h" selected>hours</option>
|
|
<option value="d">days</option>
|
|
<option value="w">weeks</option>
|
|
<option value="mo">months</option>
|
|
</select>
|
|
</div>
|
|
<div class="hint danger-hint hidden" id="customexp-err"></div>
|
|
</div>
|
|
</div>
|
|
<div class="float side-section">
|
|
<h3>Protection</h3>
|
|
<div class="protect">
|
|
<label class="toggle"><input type="checkbox" id="haspw"> Password lock</label>
|
|
<div class="pw-row hidden" id="pwrow"><div class="pw-field"><input type="password" id="password" placeholder="Password" autocomplete="new-password"><button type="button" class="reveal" id="pwreveal" title="Show password" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z"/><circle cx="12" cy="12" r="3"/><line class="eye-slash" x1="4" y1="4" x2="20" y2="20"/></svg></button></div></div>
|
|
<label class="toggle"><input type="checkbox" id="burn"> Burn after read</label>
|
|
<div class="pw-row submenu hidden" id="burnrow"><div class="exp-group readable-group"><label class="hint readable-label">Readable</label><input type="number" class="num-input" id="burnreads" min="1" value="1" aria-label="Times readable"><label class="hint readable-label">times</label></div></div>
|
|
<label class="toggle"><input type="checkbox" id="unlisted"> Unlisted</label>
|
|
</div>
|
|
</div>
|
|
<div class="float side-section">
|
|
<h3>Attachment</h3>
|
|
<div class="dropzone" id="dropzone" title="Paste (Ctrl+V), drop a file here, or click to browse">
|
|
Drop a file here, press Ctrl+V, or click to browse
|
|
</div>
|
|
<input type="file" id="file-input" class="file-input" aria-label="Choose a file">
|
|
<div id="file-chip-slot"></div>
|
|
<div class="hint hint-lg hidden mt6" id="file-text-note">File pastes ignore the text editor (one file per paste)</div>
|
|
</div>
|
|
<div class="float side-section">
|
|
<h3>Custom URL</h3>
|
|
<input type="text" id="custom" class="custom-input" placeholder="my-snippet">
|
|
</div>
|
|
<div class="float side-section hidden" id="result-card">
|
|
<h3>Result</h3>
|
|
<div class="hint wrap-normal" id="result">empty</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="/static/new.js" defer></script>
|
|
<script src="/static/jump.js" defer></script>
|
|
{{template "foot" .}}
|