Heartwood

Header Primary: Business 

<header class="header-primary">
    <div class="header-primary__left">
        <button class="hamburger btn" type="button">
			<?xml version="1.0" encoding="utf-8"?>
			<svg
				class='hamburger__icon hamburger__close'
				version="1.1"
				id="Layer_1"
				xmlns="http://www.w3.org/2000/svg"
				xmlns:xlink="http://www.w3.org/1999/xlink"
				x="0px"
				y="0px"
				width="24px"
				height="24px"
				viewBox="0 0 24 24"
				enable-background="new 0 0 24 24"
				xml:space="preserve">
			<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/><path d="M0 0h24v24H0z" fill="none"/>
			</svg>
			<?xml version="1.0" encoding="utf-8"?>
			<svg
				class='hamburger__icon hamburger__open'
				version="1.1"
				id="Layer_1"
				xmlns="http://www.w3.org/2000/svg"
				xmlns:xlink="http://www.w3.org/1999/xlink"
				x="0px"
				y="0px"
				width="24px"
				height="24px"
				viewBox="0 0 24 24"
				enable-background="new 0 0 24 24"
				xml:space="preserve">
			<path d="M0 0h24v24H0z" fill="none"/><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/>
			</svg>
		</button>
        <div>
            <p class="header-primary__text"><a href="#">Chimera Hair Salon</a></p>
        </div>
    </div>
    <div class="header-primary__right">
        <button class="btn btn-small " type="button">
					<span class="btn__inner">
							<span class="btn__text">Log In</span>
						
					</span>	
			</button>
        <button class="btn btn-primary btn-small " type="button">
					<span class="btn__inner">
							<span class="btn__text">Sign Up</span>
						
					</span>	
			</button>
    </div>
</header>
 
<header class="header-primary">
	<div class="header-primary__left">
		{{> @hamburger}}
		{{#if business}}
			<div>
				<p class="header-primary__text"><a href="#">{{{business}}}</a></p>
				{{#if address}}
				<p class="header-primary__text header-primary__address"><a href="#">{{{address}}}</a></p>
				{{/if}}
			</div>
		{{else}}
			<p class="header-primary__lockup" href="#">
				{{> @default-lockup}}
			</p>
		{{/if}}
	</div>
	<div class="header-primary__right">
		{{#if user}}
			{{> @search class="text-input-small" placeholder="Search anything…"}}
			{{> @user-menu}}
		{{else}}
			{{> @button className="btn-small" text="Log In"}}
			{{> @button className="btn-primary btn-small" text="Sign Up"}}
		{{/if}}
	</div>
</header>
 
{
  "openIcon": "<path d=\"M0 0h24v24H0z\" fill=\"none\"/><path d=\"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z\"/>",
  "closeIcon": "<path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/><path d=\"M0 0h24v24H0z\" fill=\"none\"/>",
  "business": "Chimera Hair Salon"
}

Primary Header

The Primary Header communicates to the user whether or not they are logged in and indicates which business they are logged in to, as well as providing access to their personal profile and a global search.