<form
  class='bg-white shadow-md rounded px-8 pt-6 pb-8 my-4'
  {{on 'submit' (prevent-default (perform this.requestReset))}}
  ...attributes
>
  <h2>Request Password Reset</h2>
  <p class="text-sm mt-2 mb-4 max-w-lg">
    If an account with the specified email exists, we'll send you an email with details on how to reset your password.
  </p>
  <div class='mb-4'>
    <label class='block text-gray-700 text-sm font-medium mb-2' for='email'>
      Email
    </label>
    <Input
      class='shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline'
      id='email'
      placeholder='Email'
      @type='email'
      @required={{true}}
      @value={{this.email}}
    />
  </div>

  <div class='flex items-center justify-between'>
    <div class='flex flex-col'>
      <LinkTo
        class='block align-baseline font-bold text-sm text-blue-500 hover:text-blue-800'
        @route='login'
      >
        Login
      </LinkTo>
    </div>

    <button
      type='submit'
      class='bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline ml-4'
    >
      Submit
    </button>
  </div>
</form>