{% extends "views/manage-prototype/layout.njk" %}

{% from "govuk/components/error-summary/macro.njk" import govukErrorSummary %}
{% from "govuk/components/input/macro.njk" import govukInput %}
{% from "govuk/components/button/macro.njk" import govukButton %}

{% set serviceName %}
{% endset %}

{% block pageTitle %}
  {% if error == "wrong-password" %}
    Error:
  {% endif %}
  Sign in - GOV.UK Prototype Kit
{% endblock %}


{% block header %}{% endblock %}
{% block footer %}{% endblock %}
{% block containerStart %}{% endblock %}
{% block stylesheets %}
{{ super() }}
<style>
  .govuk-heading-xl, 
  .govuk-label, 
  .govuk-button, 
  .govuk-error-summary__title, 
  .govuk-error-summary__body, 
  .govuk-error-summary__list a,
  .govuk-error-message {
    font-family: sans-serif;
  }
</style>
{% endblock %}

{% block content %}

<form method="post" action="/manage-prototype/password">
  <div class="govuk-grid-row">
    <div class="govuk-grid-column-two-thirds-from-desktop">

      {% if error == "wrong-password" %}
        {{ govukErrorSummary({
          titleText: "There is a problem",
          errorList: [
            {
              text: "The password is not correct",
              href: "#password"
            }
          ]
        })}}
      {% endif %}

      <h1 class="govuk-heading-xl">
        This is a prototype used for research
      </h1>

      <p>
          It is not a real service. You should only continue if you have been invited to test this prototype.
      </p>

      {{ govukInput({
        classes: "govuk-input--width-10",
        name: "password",
        id: "password",
        type: "password",
        errorMessage: {
          text: "The password is not correct"
        } if error == "wrong-password",
        label:{
            text: "Password"
        }
      }) }}

      <input type="hidden" name="returnURL" value="{{returnURL}}">

      {{ govukButton({
        text: "Continue"
      }) }}
    </div>
  </div>
</form>

{% endblock %}