fox-send/views/download.handlebars

<div id="download">
  {{#if filename}}
  <div id="download-page-one">
    <div class="title">
      Download <span id="dl-filename">{{filename}}</span> ({{filesize}})
    </div>
    <div class="description">
      Your friend is sending you a file with Firefox Send, a service that allows you to share files with a safe, private, and encrypted link that automatically expires to ensure your stuff does not remain online forever.
    </div>
    <img src="/resources/illustration_download.svg" id="download-img" alt="Download"/>
    <div>
      <button id="download-btn" title="Download">Download</button>
    </div>
  </div>

  <div id="download-progress">
    <div class="title">
      Downloading {{filename}} ({{filesize}})
    </div>
    <div class="description">
      Please leave this tab open while we fetch your file and decrypt it.
    </div>
    <!-- progress bar here -->
    <div class="progress-bar" id="dl-progress">
      <div class="percentage">
        <span class="percent-number"></span>
        <span class="percent-sign">%</span>
      </div>
    </div>
    <div class="upload">
      <div class="progress-text">{{filename}}</div>
    </div>
  </div>

  <a class="send-new" title="Try Firefox Send">
    Try Firefox Send
  </a>
  {{else}}
  <div class="title">
    This link has expired or never existed in the first place.
  </div>

  <div class="share-window">
    <img src="/resources/illustration_expired.svg" id="expired-img" alt="Link expired" />
  </div>
  <div class="expired-description">
    Send files through a safe, private, and encrypted link that automatically expires to ensure your stuff does not remain online forever.
  </div>
  <a class="send-new" title="Try Firefox Send">
    Try Firefox Send
  </a>
  {{/if}}
</div>