_page_upload.html

_page_upload.html (2206B)
      1 {% from "_icons.html" import icon %}
      2 <section class="page-head">
      3     <h1>Upload</h1>
      4     <p class="lede">Drop files here to get direct links. Can't remember a link later? Check the <a href="/uploads">uploads folder</a>, or your <a href="/history">history</a>.</p>
      5 </section>
      6 
      7 <div class="upload">
      8     <div class="field">
      9         <span class="field-label" id="folder-label">Save to</span>
     10         <div class="segmented" role="group" aria-labelledby="folder-label" id="folder-picker">
     11             <button type="button" class="segmented__btn is-active" aria-pressed="true" data-folder="uploads">uploads</button>
     12             <button type="button" class="segmented__btn" aria-pressed="false" data-folder="third-party">third-party</button>
     13         </div>
     14     </div>
     15 
     16     <p class="callout callout-warning" role="note">
     17         {{ icon('clock', 18) }}
     18         <span><strong>Rate limits apply.</strong> Each IP can upload <strong>200&nbsp;MB per hour</strong> (a single file can be at most <strong>200&nbsp;MB</strong>). Uploading from a link is limited to <strong>50&nbsp;MB per hour</strong>. Going over returns an error until your allowance comes back. <a href="/documentation#rate-limits">How rate limits work</a></span>
     19     </p>
     20 
     21     <label class="dropzone" id="dropzone" for="file-input">
     22         <span class="dropzone__icon">{{ icon('upload', 26, 1.75) }}</span>
     23         <span class="dropzone__title">Drag &amp; drop files here</span>
     24         <span class="dropzone__sub">or <u>click to browse</u> · you can also paste an image</span>
     25         <input type="file" id="file-input" class="sr-only" multiple>
     26     </label>
     27 
     28     <div class="field">
     29         <label class="field-label" for="url-input">Or fetch a file from a link</label>
     30         <div class="input-row">
     31             <input type="url" id="url-input" class="text-input" placeholder="https://example.com/file.zip" autocomplete="off" spellcheck="false">
     32             <button type="button" class="btn" id="url-upload-btn">{{ icon('link') }}<span>Fetch &amp; upload</span></button>
     33         </div>
     34     </div>
     35 
     36     <p id="error-box" class="alert alert-danger" role="alert" hidden></p>
     37     <ul id="results" class="upload-queue" aria-live="polite"></ul>
     38 </div>