Compare commits
2 Commits
28b4eb6127
...
ed9cbb1d36
| Author | SHA1 | Date | |
|---|---|---|---|
| ed9cbb1d36 | |||
|
1b4abcd062 |
@ -618,6 +618,15 @@ label span {
|
||||
color: var(--panel-text);
|
||||
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
display: none;
|
||||
font-size: 1.5rem;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
color: var(--panel-text);
|
||||
}
|
||||
@media (max-width: 900px) {
|
||||
.reviews-grid {
|
||||
grid-template-columns: 1fr;
|
||||
@ -628,4 +637,58 @@ label span {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.nav {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
background-color: var(--panel-background);
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 1000;
|
||||
border-top: 1px solid #0DBB99;
|
||||
}
|
||||
|
||||
.nav-item a{
|
||||
margin-right: 0;
|
||||
}
|
||||
.nav.nav-open {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.nav-list {
|
||||
flex-direction: column;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
|
||||
.footer{
|
||||
height: auto;
|
||||
}
|
||||
.footer-links{
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.footer-links li {
|
||||
margin-right: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.footer-inner{
|
||||
/* padding: 10px 0; */
|
||||
padding: 20px 0;
|
||||
}
|
||||
.footer-nav{
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
@ -8,7 +8,7 @@
|
||||
* @param {Function} onError
|
||||
*/
|
||||
function sendAjax(action,
|
||||
args = [ ],
|
||||
args = [],
|
||||
onLoad = () => { },
|
||||
onSuccess = (data) => { },
|
||||
onError = (error) => { }) {
|
||||
@ -43,6 +43,24 @@ function showToastify(message, type = "info") {
|
||||
gravity: "bottom",
|
||||
position: "left",
|
||||
className: type,
|
||||
duration: 3000 })
|
||||
duration: 3000
|
||||
})
|
||||
.showToast();
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
const toggle = document.getElementById('menu-toggle');
|
||||
const nav = document.querySelector('.nav');
|
||||
const icon = document.getElementById('menu-icon');
|
||||
|
||||
toggle.addEventListener('click', function () {
|
||||
nav.classList.toggle('nav-open');
|
||||
if (nav.classList.contains('nav-open')) {
|
||||
icon.classList.remove('fa-bars');
|
||||
icon.classList.add('fa-xmark');
|
||||
} else {
|
||||
icon.classList.remove('fa-xmark');
|
||||
icon.classList.add('fa-bars');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
@ -11,14 +12,16 @@
|
||||
<!-- Meta tags -->
|
||||
<meta name="robots" content="nofollow, noindex">
|
||||
|
||||
<?php foreach($meta_tags as $tag): ?>
|
||||
<?php foreach ($meta_tags as $tag): ?>
|
||||
<meta name="<?php echo $tag[0] ?>" content="<?php echo $tag[1] ?>">
|
||||
<?php endforeach; ?>
|
||||
|
||||
<!-- Google fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto+Slab:wght@100..900&display=swap" rel="stylesheet">
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto+Slab:wght@100..900&display=swap"
|
||||
rel="stylesheet">
|
||||
<!-- Google fonts/ -->
|
||||
|
||||
<!-- Font Awesome -->
|
||||
@ -36,27 +39,34 @@
|
||||
<link rel="stylesheet" href="<?php echo ASSETS_PATH . '/css/reset.css' ?>">
|
||||
<link rel="stylesheet" href="<?php echo ASSETS_PATH . '/css/style.css' ?>">
|
||||
</head>
|
||||
|
||||
<body class="<?php echo $body_class ?>">
|
||||
<header class="header">
|
||||
<div class="container">
|
||||
<div class="header-inner">
|
||||
<div class="logo">
|
||||
<a href="<?php the_permalink("index:home")?>">
|
||||
<img src="<?php echo ASSETS_PATH . '/images/fridgeLogo.png'?>" alt="fridgeBitesLogo" class="logo-img">
|
||||
<a href="<?php the_permalink("index:home") ?>">
|
||||
<img src="<?php echo ASSETS_PATH . '/images/fridgeLogo.png' ?>" alt="fridgeBitesLogo"
|
||||
class="logo-img">
|
||||
</a>
|
||||
</div>
|
||||
<nav class="nav">
|
||||
<ul class="nav-list">
|
||||
<li class="nav-item"><a href="<?php the_permalink("index:home")?>" class="nav-link">HOME</a></li>
|
||||
<li class="nav-item"><a href="<?php the_permalink("index:home") ?>" class="nav-link">HOME</a>
|
||||
</li>
|
||||
<li class="nav-item"><a href="#" class="nav-link">RECIPES</a></li>
|
||||
<li class="nav-item"><a href="#" class="nav-link">FAVORITES</a></li>
|
||||
<li class="nav-item"><a href="#" class="nav-link">MEAL A DAY</a></li>
|
||||
<li class="nav-item"><a href="#" class="nav-link">SUBMIT RECIPE</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="search-and-login">
|
||||
placeholder
|
||||
</div>
|
||||
<button id="menu-toggle" class="menu-toggle" aria-label="Toggle navigation">
|
||||
<i id="menu-icon" class="fa-solid fa-bars"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user