Search

Nunjucks

{% from "govuk/components/button/macro.njk" import govukButton %}
{% from "govuk/components/input/macro.njk" import govukInput %}
<div class="govuk-width-container">
  <h1 class="govuk-heading-l">Find an address</h1>
  {{ govukInput({
    label: {
      text: "Postcode"
    },
    classes: "govuk-!-width-two-thirds",
    hint: {
      text: "For example, AA3 1AB."
    },
    id: "postcode",
    name: "postcode"
  }) }}

  {{ govukInput({
    label: {
      text: "Building number or name"
    },
    classes: "govuk-!-width-two-thirds",
    hint: {
      text: "For example, 15 or Prospect Cottage."
    },
    id: "searchString",
    name: "searchString"
  }) }}

  {{ govukButton({
    text: "Find address"
  }) }}
  <p class="govuk-body govuk-!-margin-bottom-0"><a href="#" class="govuk-link">Enter address manually</a></p>
</div>