<footer class="text-white bg-bravo relative z-0 grid grid-rows-1 grid-cols-1 flex-shrink-0 flex-grow-0">
<div class="footer container md:grid md:grid-cols-12 md:auto-rows-auto py-16 h-full gap-x-6 relative z-10 row-start-1 row-end-2 col-start-1 col-end-2">
<div class="mb-6 row-start-1 row-end-2 md:col-start-1 md:col-end-5 lg:col-start-1 lg:col-end-3 xl:col-start-1 xl:col-end-5">
<a href="./index.html" class="flex items-center lg:block w-24 lg:w-auto">
<img src="/front-end/images/logo.svg" class="invert brightness-0" alt="Starter VNext" width="100" height="72" />
</a>
</div>
<div class="mb-6 row-start-1 row-end-2 md:col-start-5 md:col-end-9 lg:col-start-3 lg:col-end-6 xl:col-start-5 xl:col-end-7">
<p class="font-bold pb-3">Legal</p>
<ul class="">
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="./about-us.html">Privacy</a>
</li>
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="./sustainability.html">Cookie policy</a>
</li>
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="./sustainability.html">Terms and Conditions</a>
</li>
</ul>
</div>
<div class="mb-6 row-start-1 row-end-2 md:col-start-9 md:col-end-13 lg:col-start-6 lg:col-end-9 xl:col-start-7 xl:col-end-9">
<p class="font-bold pb-3">Company</p>
<ul class="">
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="./about-us.html">Privacy</a>
</li>
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="./sustainability.html">Cookie policy</a>
</li>
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="./sustainability.html">Terms and Conditions</a>
</li>
</ul>
</div>
<div class="mb-6 flex gap-3 flex-wrap md:justify-center lg:justify-end md:row-start-2 md:row-end-3 md:col-start-1 md:col-end-13 lg:row-start-1 lg:row-end-2 lg:col-start-9 lg:col-end-13">
<div>
<a class="w-10 h-10 flex items-center justify-center rounded-full transition-colors ease-in-out duration-300 bg-alpha hover:bg-alpha-800" href="./.html">
<div class="relative flex justify-center items-center transition ease-in duration-200">
<div class="w-5 h-5">
<svg class="w-full h-full fill-current text-white" aria-hidden="true">
<use href="/front-end/sprite.svg#icon-facebook"></use>
</svg>
</div>
</div>
<span class="sr-only">Open Facebook (opens in new window)</span>
</a>
</div>
<div>
<a class="w-10 h-10 flex items-center justify-center rounded-full transition-colors ease-in-out duration-300 bg-alpha hover:bg-alpha-800" href="./.html">
<div class="relative flex justify-center items-center transition ease-in duration-200">
<div class="w-5 h-5">
<svg class="w-full h-full fill-current text-white" aria-hidden="true">
<use href="/front-end/sprite.svg#icon-twitter"></use>
</svg>
</div>
</div>
<span class="sr-only">Open Twitter (opens in new window)</span>
</a>
</div>
<div>
<a class="w-10 h-10 flex items-center justify-center rounded-full transition-colors ease-in-out duration-300 bg-alpha hover:bg-alpha-800" href="./.html">
<div class="relative flex justify-center items-center transition ease-in duration-200">
<div class="w-5 h-5">
<svg class="w-full h-full fill-current text-white" aria-hidden="true">
<use href="/front-end/sprite.svg#icon-linkedin"></use>
</svg>
</div>
</div>
<span class="sr-only">Open LinkedIn (opens in new window)</span>
</a>
</div>
<div>
<a class="w-10 h-10 flex items-center justify-center rounded-full transition-colors ease-in-out duration-300 bg-alpha hover:bg-alpha-800" href="./.html">
<div class="relative flex justify-center items-center transition ease-in duration-200">
<div class="w-5 h-5">
<svg class="w-full h-full fill-current text-white" aria-hidden="true">
<use href="/front-end/sprite.svg#icon-youtube"></use>
</svg>
</div>
</div>
<span class="sr-only">Open Youtube (opens in new window)</span>
</a>
</div>
<div>
<a class="w-10 h-10 flex items-center justify-center rounded-full transition-colors ease-in-out duration-300 bg-alpha hover:bg-alpha-800" href="./.html">
<div class="relative flex justify-center items-center transition ease-in duration-200">
<div class="w-5 h-5">
<svg class="w-full h-full fill-current text-white" aria-hidden="true">
<use href="/front-end/sprite.svg#icon-instagram"></use>
</svg>
</div>
</div>
<span class="sr-only">Open Instagram (opens in new window)</span>
</a>
</div>
</div>
<div class="flex items-end mt-0 sm:mt-4 md:mt-0 md:justify-center lg:justify-end flex-wrap md:row-start-3 md:row-end-4 xl:row-start-2 xl:row-end-3 md:col-start-1 md:col-end-13">
<p class="mr-6">© 2022 MentorKit</p>
<p>Site by <a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" target="blank" href="https://www.mentordigital.co.uk">Mentor Digital</a></p>
</div>
</div>
</footer>
<footer class="text-white bg-bravo relative z-0 grid grid-rows-1 grid-cols-1 flex-shrink-0 flex-grow-0">
<div class="footer container md:grid md:grid-cols-12 md:auto-rows-auto py-16 h-full gap-x-6 relative z-10 row-start-1 row-end-2 col-start-1 col-end-2">
<div class="mb-6 row-start-1 row-end-2 md:col-start-1 md:col-end-5 lg:col-start-1 lg:col-end-3 xl:col-start-1 xl:col-end-5">
{% render "@footer-logo" %}
</div>
<div class="mb-6 row-start-1 row-end-2 md:col-start-5 md:col-end-9 lg:col-start-3 lg:col-end-6 xl:col-start-5 xl:col-end-7">
<p class="font-bold pb-3">Legal</p>
<ul class="">
{% for item in navItems %}
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="{{ item.url | path }}">{{item.menu_item}}</a>
</li>
{% endfor %}
</ul>
</div>
<div class="mb-6 row-start-1 row-end-2 md:col-start-9 md:col-end-13 lg:col-start-6 lg:col-end-9 xl:col-start-7 xl:col-end-9">
<p class="font-bold pb-3">Company</p>
<ul class="">
{% for item in navItemsTwo %}
<li class="pb-2">
<a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" href="{{ item.url | path }}">{{item.menu_item}}</a>
</li>
{% endfor %}
</ul>
</div>
<div class="mb-6 flex gap-3 flex-wrap md:justify-center lg:justify-end md:row-start-2 md:row-end-3 md:col-start-1 md:col-end-13 lg:row-start-1 lg:row-end-2 lg:col-start-9 lg:col-end-13">
{% for item in socialList %}
<div>
<a class="w-10 h-10 flex items-center justify-center rounded-full transition-colors ease-in-out duration-300 bg-alpha hover:bg-alpha-800" href="{{ item.url | path }}">
<div class="relative flex justify-center items-center transition ease-in duration-200">
<div class="w-5 h-5">
{% render "@icon", { name: item.iconName, modifier: 'w-full h-full fill-current text-white', ariaHidden: true } %}
</div>
</div>
<span class="sr-only">Open {{item.name}} (opens in new window)</span>
</a>
</div>
{% endfor %}
</div>
<div class="flex items-end mt-0 sm:mt-4 md:mt-0 md:justify-center lg:justify-end flex-wrap md:row-start-3 md:row-end-4 xl:row-start-2 xl:row-end-3 md:col-start-1 md:col-end-13">
<p class="mr-6">© 2022 MentorKit</p>
<p>Site by <a class="border-b border-transparent hover:border-b hover:border-white transition ease-in duration-200" target="blank" href="https://www.mentordigital.co.uk">Mentor Digital</a></p>
</div>
</div>
</footer>
{
"siteName": "MentorKit Pattern Library",
"image": {
"src": "images/test-imagery/example6@16-4@2000w.jpg",
"srcSet": [
{
"url": "images/test-imagery/example6@16-4@2000w.jpg",
"size": 1200
}
],
"smMaxSrcSet": [
{
"url": "images/test-imagery/example6@1-1@1200w.jpg",
"size": 1200
}
],
"mdMaxSrcSet": [
{
"url": "images/test-imagery/example6@16-6@2000w.jpg",
"size": 1920
}
]
},
"navItems": [
{
"menu_item": "Privacy",
"url": "./about-us"
},
{
"menu_item": "Cookie policy",
"url": "./sustainability"
},
{
"menu_item": "Terms and Conditions",
"url": "./sustainability"
}
],
"navItemsTwo": [
{
"menu_item": "Privacy",
"url": "./about-us"
},
{
"menu_item": "Cookie policy",
"url": "./sustainability"
},
{
"menu_item": "Terms and Conditions",
"url": "./sustainability"
}
],
"socialList": [
{
"url": "./",
"iconName": "icon-facebook",
"name": "Facebook"
},
{
"url": "./",
"iconName": "icon-twitter",
"name": "Twitter"
},
{
"url": "./",
"iconName": "icon-linkedin",
"name": "LinkedIn"
},
{
"url": "./",
"iconName": "icon-youtube",
"name": "Youtube"
},
{
"url": "./",
"iconName": "icon-instagram",
"name": "Instagram"
}
]
}
No notes defined.