Connect Dementia Research

Pattern Library

Postcode lookup

Postcode or enter manually

HTML

    
<div class="form__field input-field input-field--text input-field--postcode-lookup input-field--short">
  <label>Postcode
    <input id="postcoode" name="postcoode" type="text"  />
  </label>
  <button class="button button--tertiary button--postcode-find" type="button">Find</button>
  <a class="link link--enter-manually" href="#">or enter manually</a>
</div>

SCSS

    .input-field--postcode-lookup {
  @include small-font();
  position: relative;
  margin-bottom: 28px;

  .button--postcode-find,
  .link--enter-manually {
    display: inline-block;
    margin: 8px 16px 0 0;
  }
}