improvement: use qdouze navigation

This commit is contained in:
Kazhnuz 2022-12-18 10:42:34 +01:00
parent 618b1461cf
commit d4fb2c4cc0
7 changed files with 52 additions and 99 deletions

View file

@ -1,22 +1,17 @@
<footer class="bg-dark"> <footer class="bg-dark">
<ul class="social"> <nav class="container menu toolbar bg-light fg-dark">
<ul class="f-end">
<?php <?php
$listmenu = get_nav_menu_locations(); $listmenu = get_nav_menu_locations();
$menu = wp_get_nav_menu_items($listmenu['social']); $menu = wp_get_nav_menu_items($listmenu['social']);
if ($menu != null) { if ($menu != null) {
foreach ($menu as $menuElement) { foreach ($menu as $menuElement) {
echo '<li class="social-li"><a class="social-link" href="'. $menuElement->url .'" title="Accéder à mon '.$menuElement->title.'" aria-label="Accéder à mon '.$menuElement->title.'"><i class="fa fa-fw fa-'.$menuElement->title.'" aria-hidden="true"></i></a></li> '; echo '<li><a class="menu-item" href="'. $menuElement->url .'" title="Accéder à mon '.$menuElement->title.'" aria-label="Accéder à mon '.$menuElement->title.'"><i class="fa fa-fw fa-'.$menuElement->title.'" aria-hidden="true"></i></a></li> ';
} }
} }
?> ?>
<li class="social-li">
<a class="social-link" href="https://kazhnuz.space/links" title="Plus de liens" aria-label="Plus de liens">
<i class="fa fa-fw fa-ellipsis-h" aria-hidden="true"></i>
</a>
</li>
</ul> </ul>
</nav>
<div class="container columns"> <div class="container columns">
<div class="col-md-4"> <div class="col-md-4">
<p>Les contenus sont diffusé sous licence Creative Common Attribution - Partage à l'Identique 4.0 - hors mention contraire.</p> <p>Les contenus sont diffusé sous licence Creative Common Attribution - Partage à l'Identique 4.0 - hors mention contraire.</p>

View file

@ -1,4 +1,5 @@
<header id="page-header"> <header id="page-header">
<?php include(TEMPLATEPATH . '/components/navbar-pages.php'); ?> <?php include(TEMPLATEPATH . '/components/navbar-pages.php'); ?>
<?php include(TEMPLATEPATH . '/components/logo.php'); ?> <?php include(TEMPLATEPATH . '/components/logo.php'); ?>
<?php include(TEMPLATEPATH . '/components/navbar-category.php'); ?>
</header> </header>

View file

@ -1,19 +1,16 @@
<nav class="navbar navbar-expand-lg navbar-dark bg-grey" id="navbar-category"> <nav class="container menu toolbar bg-light fg-dark categories">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <ul class="f-around">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav nav-justified w-100">
<?php <?php
$categories = get_categories( array( $categories = get_categories( array(
'orderby' => 'name', 'orderby' => 'name',
'order' => 'ASC' 'order' => 'ASC'
) ); ) );
foreach( $categories as $category ) { foreach( $categories as $category ) {?>
echo '<li class="nav-item"><a class="nav-link" href="' . get_category_link($category->term_id) . '">' . $category->name . '</a></li>'; <li>
}?> <a class="menu-item" href="<?php echo get_category_link($category->term_id) ?>"><?php echo $category->name ?></a>
</li>
<?php }
?>
</ul> </ul>
</div>
</nav> </nav>

View file

@ -2,7 +2,7 @@
<nav class="container menu toolbar fg-light"> <nav class="container menu toolbar fg-light">
<ul> <ul>
<li> <li>
<a href="<?php echo site_url(); ?>" class="btn btn-navbar"> <a href="<?php echo site_url(); ?>" class="menu-item">
<i class="fa fa-home" aria-hidden="true"></i><span class="sr-only">Accueil</span> <i class="fa fa-home" aria-hidden="true"></i><span class="sr-only">Accueil</span>
</a> </a>
</li> </li>
@ -10,7 +10,7 @@
$listmenu = get_nav_menu_locations(); $listmenu = get_nav_menu_locations();
$menu = wp_get_nav_menu_items($listmenu['top-navbar']); $menu = wp_get_nav_menu_items($listmenu['top-navbar']);
foreach ($menu as $menuElement) { foreach ($menu as $menuElement) {
echo '<li><a href="' . $menuElement->url . '" class="btn btn-navbar">'. $menuElement->title . '</a></li>'; echo '<li><a href="' . $menuElement->url . '" class="menu-item">'. $menuElement->title . '</a></li>';
} }
?> ?>
</ul> </ul>
@ -20,10 +20,10 @@
$listmenu = get_nav_menu_locations(); $listmenu = get_nav_menu_locations();
$menu = wp_get_nav_menu_items($listmenu['top-navbar-2']); $menu = wp_get_nav_menu_items($listmenu['top-navbar-2']);
foreach ($menu as $menuElement) { foreach ($menu as $menuElement) {
echo '<li><a href="' . $menuElement->url . '" class="btn btn-navbar">'. $menuElement->title . '</a></li>'; echo '<li><a href="' . $menuElement->url . '" class="menu-item">'. $menuElement->title . '</a></li>';
} }
?> ?>
<li><a href="<?php bloginfo('rss2_url'); ?>" class="btn btn-navbar"><i class="fa fa-rss" aria-hidden="true"></i><span class="sr-only">Flux RSS du site</span></a></li> <li><a href="<?php bloginfo('rss2_url'); ?>" class="menu-item"><i class="fa fa-rss" aria-hidden="true"></i><span class="sr-only">Flux RSS du site</span></a></li>
</ul> </ul>
</nav> </nav>
</div> </div>

View file

@ -1,5 +1,3 @@
<?php include(TEMPLATEPATH . '/components/sidebar/last-articles.php'); ?> <?php include(TEMPLATEPATH . '/components/sidebar/last-articles.php'); ?>
<?php include(TEMPLATEPATH . '/components/sidebar/categories.php'); ?> <?php include(TEMPLATEPATH . '/components/sidebar/categories.php'); ?>
<?php include(TEMPLATEPATH . '/components/sidebar/tags.php'); ?>
<?php include(TEMPLATEPATH . '/components/sidebar/archives.php'); ?> <?php include(TEMPLATEPATH . '/components/sidebar/archives.php'); ?>
<?php include(TEMPLATEPATH . '/components/sidebar/links.php'); ?>

View file

@ -32,6 +32,7 @@
#page-header { #page-header {
background: $color-primary url('img/background.png'); background: $color-primary url('img/background.png');
margin-bottom:1.5rem;
} }
header h1 { header h1 {
@ -71,6 +72,11 @@ header h1 {
@include li-no-margin(); @include li-no-margin();
} }
.categories {
font-weight:800;
font-size:0.8rem;
}
.dropdown-menu { .dropdown-menu {
box-shadow: $narrow-shadow, $inset-shadow; box-shadow: $narrow-shadow, $inset-shadow;
} }
@ -197,10 +203,9 @@ body {
footer { footer {
color: $color-footer-text; color: $color-footer-text;
padding-top:1.5rem;
font-size: 0.8rem!important;
padding-bottom:1.5rem; padding-bottom:1.5rem;
.columns {
font-size:0.8rem;
a, a,
a:visited { a:visited {
&:hover, &:hover,
@ -209,32 +214,6 @@ footer {
color: $color-footer-text; color: $color-footer-text;
} }
} }
}
/* social media */
ul.social {
font-size:1.5em;
padding-bottom:1.5em;
margin:auto;
text-align:center;
li {
margin:0;
list-style: none;
display: inline;
a, a:visited {
color: $color-footer-back;
background-color: $color-footer-text;
padding:0.3em;
padding-left:0.36em;
padding-right:0.36em;
vertical-align:middle;
border-radius:100%;
&:hover {
color:$color-footer-text;
background-color: $color-footer-back;
}
}
} }
} }

View file

@ -2749,7 +2749,8 @@ th {
/* ------------------ HEADERS ------------------- */ /* ------------------ HEADERS ------------------- */
#page-header { #page-header {
background: #e33d22 url("img/background.png"); } background: #e33d22 url("img/background.png");
margin-bottom: 1.5rem; }
header h1 { header h1 {
border-style: none !important; border-style: none !important;
@ -2781,6 +2782,10 @@ header h1 {
.navbar li { .navbar li {
margin: 0; } margin: 0; }
.categories {
font-weight: 800;
font-size: 0.8rem; }
.dropdown-menu { .dropdown-menu {
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0), inset 0px -2px 0px rgba(0, 0, 0, 0); } box-shadow: 0px 1px 2px rgba(0, 0, 0, 0), inset 0px -2px 0px rgba(0, 0, 0, 0); }
@ -2892,37 +2897,15 @@ body {
footer { footer {
color: #fefefe; color: #fefefe;
padding-top: 1.5rem;
font-size: 0.8rem !important;
padding-bottom: 1.5rem; } padding-bottom: 1.5rem; }
footer a:hover, footer a:active, footer a:visited, footer .columns {
footer a:visited:hover, font-size: 0.8rem; }
footer a:visited:active, footer .columns a:hover, footer .columns a:active, footer .columns a:visited,
footer a:visited:visited { footer .columns a:visited:hover,
footer .columns a:visited:active,
footer .columns a:visited:visited {
color: #fefefe; } color: #fefefe; }
/* social media */
ul.social {
font-size: 1.5em;
padding-bottom: 1.5em;
margin: auto;
text-align: center; }
ul.social li {
margin: 0;
list-style: none;
display: inline; }
ul.social li a, ul.social li a:visited {
color: #343a40;
background-color: #fefefe;
padding: 0.3em;
padding-left: 0.36em;
padding-right: 0.36em;
vertical-align: middle;
border-radius: 100%; }
ul.social li a:hover, ul.social li a:visited:hover {
color: #fefefe;
background-color: #343a40; }
.container-article { .container-article {
margin: auto; margin: auto;
width: 800px; } width: 800px; }