dan/windycoys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ensure layout is correct when nav__body is empty

Browse Source
This commit is contained in:
Dan Head
2018-12-21 20:55:26 +00:00
parent 426eef8051
commit cd1faceaf1
2 changed files with 44 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
css/nav.css
View File

@@ -44,6 +44,10 @@
top: 32px;
}
.nav__body {
flex-grow: 1;
}
.nav__title {
font-family: var(--heading-font-family);
font-size: 2.5rem;
@@ -118,10 +122,6 @@
top: -10000px;
}
.nav__menu {
flex-grow: 1;
}
/**
* nav List
*/

74
theme/partials/navigation.php
View File

@@ -7,41 +7,47 @@
<span class="menu__text">Open menu</span>
</button>
<div class="nav__content">
<h2 class="nav__title">
<a class="nav__title-link" href="<?php get_site_url() ?>/" aria-label="Back Home" tabindex="-1">
<span class="nav__title-link-icon">
<svg class="icon icon--extra-large">
<use xlink:href="#icon-windy"></use>
<div class="nav__head">
<h2 class="nav__title">
<a class="nav__title-link" href="<?php get_site_url() ?>/" aria-label="Back Home" tabindex="-1">
<span class="nav__title-link-icon">
<svg class="icon icon--extra-large">
<use xlink:href="#icon-windy"></use>
</svg>
</span>
<img src="<?php echo get_template_directory_uri(); ?>/images/icon.png" alt="WindyCOYS logo" class="nav__title-link-image" data-load-transition="false">
</a>
</h2>
</div>
<div class="nav__body">
<?php wp_nav_menu(array(
menu => 'navigation',
container_class => 'nav__menu',
menu_class => 'nav__list',
walker => new Windycoys_Walker_Navigation()
)); ?>
</div>
<div class="nav__foot">
<div class="nav__social">
<a class="nav__social-link" href="https://www.facebook.com/WindyCOYS/">
<svg class="icon icon--large">
<use xlink:href="#icon-facebook"></use>
</svg>
</span>
<img src="<?php echo get_template_directory_uri(); ?>/images/icon.png" alt="WindyCOYS logo" class="nav__title-link-image" data-load-transition="false">
</a>
</h2>
<?php wp_nav_menu(array(
menu => 'navigation',
container_class => 'nav__menu',
menu_class => 'nav__list',
walker => new Windycoys_Walker_Navigation()
)); ?>
<div class="nav__social">
<a class="nav__social-link" href="https://www.facebook.com/WindyCOYS/">
<svg class="icon icon--large">
<use xlink:href="#icon-facebook"></use>
</svg>
</a>
<a class="nav__social-link" href="https://twitter.com/windycoys/">
<svg class="icon icon--large">
<use xlink:href="#icon-twitter"></use>
</svg>
</a>
</a>
<a class="nav__social-link" href="https://twitter.com/windycoys/">
<svg class="icon icon--large">
<use xlink:href="#icon-twitter"></use>
</svg>
</a>
</div>
<div class="nav__search">
<?php get_search_form() ?>
</div>
<button class="nav__close">
<span class="nav__close-bar"></span>
<span class="nav__close-bar"></span>
<span class="nav__close-text">Close menu</span>
</button>
</div>
<div class="nav__search">
<?php get_search_form() ?>
</div>
<button class="nav__close">
<span class="nav__close-bar"></span>
<span class="nav__close-bar"></span>
<span class="nav__close-text">Close menu</span>
</button>
</div>
</nav>