cruk-pattern-library-api/patterns/header.html

CRUK Pattern Library API

<div class="cr-header">
    <div class="cr-header__logo">
        <a href="https://www.cancerresearchuk.org/" title="Cancer Research UK Homepage" rel="home">
            <img class="cr-header__logo-img"
                 src="https://www.cancerresearchuk.org/sites/all/themes/custom/cruk/cruk-logo.svg"
                 alt="Cancer Research UK Homepage">
        </a>
    </div>
    <div class="cr-header__slogan">
        <h2 class="cr-header__site-slogan">Together we will beat cancer</h2>
    </div>
    <div class="cr-header__search">
        <form role="search" class="cr-search-input" action="https://find.cancerresearchuk.org/">
            <label class="cr-search-input__label">Search...</label>
            <input name="xss-q" class="cr-search-input__input" placeholder="Search..." autocomplete="off" autocorrect="off" type="search">
            <button type="submit" class="cr-search-input__button" aria-label="Submit your search">Search...</button>
        </form>
    </div>
    <div class="cr-header__cta">
        <a class="cr-cta--primary" href="https://www.cancerresearchuk.org/get-involved/donate/">
            Donate
        </a>
    </div>
</div>