opdavies/oliverdavies.uk-old-sculpin
Archived
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Refactor nav

Browse source
This commit is contained in:
Oliver Davies 2019-07-29 08:46:25 +01:00
parent 8eefcb6074
commit a1489aec0a
2 changed files with 4 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
source/_layouts/default.html.twig
View file

@ -3,7 +3,7 @@
{% block body %} {% block body %}
{% include 'layout/navbar' %} {% include 'layout/navbar' %}
<div class="container mt-32 flex flex-col flex-1"> <div class="container flex flex-col flex-1">
<main id="main-content" class="flex-1 wrap {{ page.layout == 'front' ? 'is-wide' : '' }}"> <main id="main-content" class="flex-1 wrap {{ page.layout == 'front' ? 'is-wide' : '' }}">
{% block page_title_wrapper %} {% block page_title_wrapper %}
<h1 class="leading-tight mb-4"> <h1 class="leading-tight mb-4">

8
source/_partials/layout/navbar.html.twig
View file

@ -1,4 +1,4 @@
<div id="nav" class="w-full fixed top-0 mb-6 z-20 bg-blue-500 border-b-3 border-blue-700"> <div id="nav" class="mb-6 bg-blue-500 border-b-3 border-blue-700">
<div class="container"> <div class="container">
<div class="md:flex"> <div class="md:flex">
<div class="w-full flex items-center md:w-1/3 lg:w-1/4"> <div class="w-full flex items-center md:w-1/3 lg:w-1/4">
@ -26,15 +26,13 @@
</div> </div>
<nav <nav
class="w-full absolute py-4 -mx-4 mt-2px bg-blue-700 border-b md:mt-0 md:mx-0 md:relative md:flex md:flex-wrap md:flex-1 md:justify-end md:bg-blue-500 md:border-b-0" class="mt-2px -mx-4 py-4 bg-blue-700 md:mt-0 md:mx-0 md:relative md:flex md:flex-wrap md:flex-1 md:justify-end md:bg-blue-500 md:border-b-0"
:class="[ isOpen ? 'block' : 'hidden' ]" :class="[ isOpen ? 'block' : 'hidden' ]"
role="navigation"
> >
{% for item in site.menus.main %} {% for item in site.menus.main %}
{% set currentPage = page.url matches '#' ~ item.pattern ~ '#' %} {% set currentPage = page.url matches '#' ~ item.pattern ~ '#' %}
<a <a
class="mx-4 mt-1 -mb-px py-3 px-4 block rounded text-sm text-white no-underline hover:underline focus:outline-none focus:underline md:py-1 md:px-2 md:mx-2 md:mt-0 md:mr-0 class="mx-4 mt-1 -mb-px py-3 px-4 block rounded text-sm text-white no-underline hover:underline focus:outline-none focus:underline md:py-1 md:px-2 md:mx-2 md:mt-0 md:mr-0 {{ currentPage ? 'cursor-default bg-blue-500 hover:border-blue-600 hover:no-underline md:bg-blue-700' }}"
{{ currentPage ? 'cursor-default bg-blue-500 hover:border-blue-600 hover:no-underline md:bg-blue-700' }}"
href="{{ item.href }}" href="{{ item.href }}"
{% if currentPage %}aria-current="page"{% endif %} {% if currentPage %}aria-current="page"{% endif %}
> >