<section class="filter--section reset-password">
  <form method="post" id="form" name="form" novalidate autocomplete="new-password">
    <div class="section--wrapper-input">
      <h2>{{'reset_password_title' | translate}}</h2>
      <p>{{'reset_password_subtitle' | translate}}</p>
    </div>
    <div class="section--wrapper-input">
      <!-- BEGIN Ugly patch to allow Browsers to update stored password -->
      <input id="username" type="email" name="username" ng-model="vm.username" spellcheck="false" readonly style="display:none" />
      <!-- END -->
      <input class="input input--large" ng-class="{true: 'error'}[vm.submitted && form.resetPassword.$invalid]" id="resetPassword" type="password" name="resetPassword" ng-model="resetPassword" pass="resetPassword" ng-change="vm.updateValidation()" maxlength="100" ng-maxlength="100" placeholder="{{'reset_password_placeholder' | translate}}" autocomplete="new-password" password-complex-validation required />
      <span class="input--error" ng-show="(vm.submitted ||form.resetPassword.$dirty) && form.resetPassword.$error.required"><i class="arrow--up"></i>{{'validation_error_required' | translate}}</span>
      <span class="input--error" ng-show="(vm.submitted ||form.resetPassword.$dirty) && form.resetPassword.$error.strength && !form.resetPassword.$error.required"><i class="arrow--up"></i>{{'pass_not_allowed' | translate}}</span>
      <input class="input input--large" ng-class="{true: 'error'}[vm.submitted && form.resetPasswordConf.$invalid]" id="resetPasswordConf" type="password" name="resetPasswordConf" ng-model="resetPasswordConf" ng-change="vm.updateValidation()" maxlength="100" ng-maxlength="100" placeholder="{{'reset_passwordConf_placeholder' | translate}}" autocomplete="new-password" required />
      <span class="input--error" ng-show="(vm.submitted ||form.resetPasswordConf.$dirty) && form.resetPasswordConf.$error.required"><i class="arrow--up"></i>{{'validation_error_required' | translate}}</span>
      <span class="input--error" ng-show="(vm.submitted ||form.resetPasswordConf.$dirty) && form.resetPasswordConf.$error.strength && !form.resetPasswordConf.$error.required"><i class="arrow--up"></i>{{'pass_not_allowed' | translate}}</span>
      <span class="input--error" ng-show="(vm.submitted ||form.resetPasswordConf.$dirty) && form.resetPasswordConf.$error.same"><i class="arrow--up"></i>{{'login_error_same_password' | translate}}</span>
    </div>
    <div class="section--wrapper-input">
      <button class="button button--medium" ng-click="vm.submitResetPassword()">{{'reset_password_submit' | translate}}</button>
    </div>
  </form>
</section>
