Add Menu and Navigation

This commit is contained in:
2018-02-12 19:48:25 +00:00
parent 5f05b29d0b
commit 285305af67
16 changed files with 453 additions and 43 deletions

2
theme/footer.php Normal file
View File

@@ -0,0 +1,2 @@
<script type="text/javascript" src="<?php echo get_template_directory_uri()
?>/bundle.js"></script>

View File

@@ -1,5 +1,24 @@
<?php
class Windycoys_Walker extends Walker_Nav_Menu {
function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {
$title = $item->post_title;
$uri = get_site_url() . '/' . $item->post_name;
$output .= '<li class="Nav-listItem">';
$output .= '<a class="Nav-link" href="' . $uri .'">';
$output .= $title . '</a></li>';
}
}
function windycoys_nav() {
wp_nav_menu(array(
'container' => 'ul',
'menu_class' => 'Nav-list Nav--subList',
'walker' => new Windycoys_Walker()
));
}
function windycoys_the_tags() {
$tags = get_the_tags();
if ($tags) {

View File

@@ -1,31 +1,35 @@
<?php get_header() ?>
<main class="Grid">
<?php get_template_part('partials/logo') ?>
<?php while ( have_posts() ) : the_post() ?>
<section class="Grid-article">
<article class="Article">
<div class="Article-date">
<svg class="Icon">
<use href="#icon-calendar"></use>
</svg>
<span class="Article-dateText">
<?php the_time(get_option('date_format')) ?>
</span>
</div>
<h1 class="Article-title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</h1>
<div class="Article-content">
<?php the_content( __( 'Continue reading <span class="meta-nav">&raquo;</span>', 'windycoys' ) ); ?>
</div>
</article>
</section>
<section class="Grid-metadata">
<?php get_template_part('partials/metadata') ?>
</section>
<?php endwhile; ?>
<section class="Grid-footer">
<?php get_template_part('partials/footer') ?>
</section>
<main class="Grid">
<?php get_template_part('partials/logo') ?>
<?php while ( have_posts() ) : the_post() ?>
<section class="Grid-article">
<article class="Article">
<div class="Article-date">
<svg class="Icon">
<use href="#icon-calendar"></use>
</svg>
<span class="Article-dateText">
<?php the_time(get_option('date_format')) ?>
</span>
</div>
<h1 class="Article-title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</h1>
<div class="Article-content">
<?php the_content( __( 'Continue reading <span class="meta-nav">&raquo;</span>', 'windycoys' ) ); ?>
</div>
</article>
</section>
<section class="Grid-metadata">
<?php get_template_part('partials/metadata') ?>
</section>
<?php endwhile; ?>
<section class="Grid-footer">
<?php get_template_part('partials/footer') ?>
</section>
</main>
<?php get_template_part('partials/menu') ?>
<?php get_template_part('partials/nav') ?>
<?php get_footer() ?>

6
theme/partials/menu.php Normal file
View File

@@ -0,0 +1,6 @@
<button class="Menu">
<span class="Menu-line"></span>
<span class="Menu-line"></span>
<span class="Menu-line"></span>
<span class="Menu-text">Open menu</span>
</button>

View File

@@ -1,14 +1,36 @@
<header class="Header">
<div class="Header-logo">
<a href="<?php echo home_url(); ?>">
<img src="<?php echo get_template_directory_uri(); ?>/img/logo.png" alt="Logo" class="logo-img">
</a>
</div>
<nav class="Nav">
<nav class="Nav">
<div class="Nav-content">
<h2 class="Nav-title">WindyCOYS</h2>
<ul class="Nav-list">
<li class="Nav-item">
<a class="Nav-link" href="#">About</a>
<li class="Nav-listItem">
<a class="Nav-link" href="<?php get_site_url() ?>/">Home</a>
<?php windycoys_nav() ?>
</li>
</ul>
</nav>
</header>
<button class="Nav-close">
<span class="Nav-closeBar"></span>
<span class="Nav-closeBar"></span>
<span class="Nav-closeText">Close menu</span>
</button>
<div class="Nav-social">
<a class="Nav-socialLink" href="https://www.facebook.com/WindyCOYS/">
<svg class="Icon Icon--large">
<use href="#icon-facebook"></use>
</svg>
</a>
<a class="Nav-socialLink" href="https://twitter.com/windycoys/">
<svg class="Icon Icon--large">
<use href="#icon-twitter"></use>
</svg>
</a>
</div>
<div class="Nav-search">
<?php get_search_form() ?>
</div>
</div>
<button class="Nav-close">
<span class="Nav-closeBar"></span>
<span class="Nav-closeBar"></span>
<span class="Nav-closeText">Close menu</span>
</button>
</nav>

9
theme/searchform.php Normal file
View File

@@ -0,0 +1,9 @@
<form id="searchform" role="search" method="get" action="<?php get_site_url()?>">
<div class="Search">
<label class="Search-label" for="searchinput">
Search
</label>
<input id="searchinput" class="Search-input" name="s" type="text" placeholder="Search">
<input id="searchsubmit" class="Search-submit" value="Search" type="submit">
</div>
</form>