packages/fxa-content-server/app/scripts/templates/reset_password.mustache

<div id="main-content" class="card">
  <header class="mb-4">
    <h1 id="fxa-reset-password-header" class="card-header">
      <!-- L10N: For languages structured like English, the second phrase can read "to continue to %(serviceName)s" -->
      {{#t}}Reset password{{/t}} <span class="card-subheader">{{#t}}Continue to %(serviceName)s{{/t}}</span>
    </h1>
  </header>

  <section>
    <div class="error"></div>

    <form novalidate>
      <p class="reset-warning">
        {{#unsafeTranslate}}<span>NOTE:</span> When you reset your password, you reset your account. You may lose some of your personal information (including history, bookmarks, and passwords). That’s because we encrypt your data with your password to protect your privacy. You’ll still keep any subscriptions you may have and Pocket data will not be affected.{{/unsafeTranslate}}
      </p>
      <div class="input-row">
        {{#forceEmail}}
          <p id="prefillEmail" class="text-base break-all">{{ forceEmail }}</p>
          <input type="email" class="email hidden" value="{{ forceEmail }}" disabled />
        {{/forceEmail}}
        {{^forceEmail}}
          <input name="email" type="email" class="email" placeholder="{{#t}}Email{{/t}}" spellcheck="false" autofocus required autocomplete="off" />
        {{/forceEmail}}
      </div>

      <div class="flex">
        <button id="submit-btn" type="submit" class="cta-primary cta-xl">{{#t}}Begin reset{{/t}}</button>
      </div>
    </form>

    {{#canGoBack}}
    <div class="links">
      <a href="#" id="remember-password" class="link-blue mt-5">{{#t}}Remember password? Sign in{{/t}}</a>
    </div>
    {{/canGoBack}}

  </section>
</div>