<div class="basic-header">
<div class="basic-header__wrapper">
<div class="basic-header__content">
<div class="header-base header-base--light">
<div class="header-base__breadcrumbs">
<nav aria-label="Breadcrumb navigation" class="breadcrumbs breadcrumbs--">
<ul class="breadcrumbs__list">
<li class="breadcrumbs__item">
<a href="#" class="breadcrumbs__item-link">
Home</a><span class="breadcrumbs__separator"><svg aria-hidden="true" class="icon-right-triangle" xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8">
<path class="_mark icon-right-triangle__shape" fill="#AEB4BA" fill-rule="evenodd" d="M0 0l6 4-6 4z" />
</svg>
</span>
</li>
<li class="breadcrumbs__item">
<a href="#" class="breadcrumbs__item-link">
Our Work</a><span class="breadcrumbs__separator"><svg aria-hidden="true" class="icon-right-triangle" xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8">
<path class="_mark icon-right-triangle__shape" fill="#AEB4BA" fill-rule="evenodd" d="M0 0l6 4-6 4z" />
</svg>
</span>
</li>
<li class="breadcrumbs__item">
<a href="#" class="breadcrumbs__item-link">
Interior Page One</a><span class="breadcrumbs__separator"><svg aria-hidden="true" class="icon-right-triangle" xmlns="http://www.w3.org/2000/svg" width="6" height="8" viewBox="0 0 6 8">
<path class="_mark icon-right-triangle__shape" fill="#AEB4BA" fill-rule="evenodd" d="M0 0l6 4-6 4z" />
</svg>
</span>
</li>
<li class="breadcrumbs__item">
<span class="breadcrumbs__item-current">
Child Page 2
</span>
</li>
</ul>
</nav>
</div>
<div class="header-base__title">
<h1 class="header-base__title-header">Interior Page</h1>
</div>
<figure class="image image--with-caption">
<picture class="image__picture">
<img class="image__image" loading="lazy" type="image/jpeg" src="holder.js/880x560" alt="">
</picture>
<figcaption class="image__caption">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut purus eget sapien.
</figcaption>
</figure>
</div>
</div>
</div>
</div>
<div class="basic-header">
<div class="basic-header__wrapper">
<div class="basic-header__content">
{% include "templates/header-base/header-base.twig" with {
breadcrumbs: breadcrumbs,
post: post,
background: background
} %}
</div>
</div>
</div>
{
"site": {
"name": "E3 Alliance"
},
"mainMenu": {
"currentPageInMenu": true,
"items": [
{
"title": "Our Work",
"url": "https://google.com",
"isActive": true,
"isChildActive": false,
"isDescendantActive": true,
"children": [
{
"title": "Interior Page 1",
"url": "http://google.com",
"isActive": false,
"isChildActive": true,
"isDescendantActive": true,
"children": [
{
"title": "Child Page 1",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Child Page 2",
"url": "http://google.com",
"isActive": true,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Child Page 3",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
}
]
},
{
"title": "Interior Page 2",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": [
{
"title": "Child Page 1",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Child Page 2",
"url": "http://google.com",
"isActive": true,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Child Page 3",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
}
]
},
{
"title": "Interior Page 3",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
}
]
},
{
"title": "Services",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": [
{
"title": "Interior Page 1",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 2",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 3",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
}
]
},
{
"title": "About",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": [
{
"title": "Interior Page 1 Interior Page 1 Interior Page 1 Interior Page 1",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 2",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 3",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 4",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": true,
"children": []
},
{
"title": "Interior Page 5",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 6",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 7",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
}
]
},
{
"title": "Invest",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": [
{
"title": "Interior Page 1",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 2",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
},
{
"title": "Interior Page 3",
"url": "http://google.com",
"isActive": false,
"isChildActive": false,
"isDescendantActive": false,
"children": []
}
]
}
]
},
"breadcrumbs": [
{
"title": "Home",
"url": "#"
},
{
"title": "Our Work",
"url": "#"
},
{
"title": "Interior Page One",
"url": "#"
},
{
"title": "Child Page 2",
"url": "#"
}
],
"sidebar": true,
"isLandingPage": false,
"post": {
"title": "Interior Page",
"featuredImage": {
"src": "holder.js/880x560",
"altText": "nature, in its natural habitat",
"caption": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut purus eget sapien."
}
}
}
breakpoint = 1000px
.basic-header
background none
fluid(padding-bottom, 40px, 80px)
fluid(padding-top, 28px, 80px)
&__wrapper
position relative
margin auto
No notes defined.