/home/bdqbpbxa/demo-subdomains/gumballpay.goodface.com.ua/wp-content/themes/gumballpay/header.php
<!DOCTYPE html>
<html lang="en" class="--blue-body">
<head>
<meta charset="UTF-8">
<meta name="description" content="Page description">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- TODO: Set absolute page URL -->
<link rel="canonical" href="<?php echo get_the_permalink(); ?>">
<!-- Mobile -->
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>
<?php echo wp_get_document_title(); ?>
</title>
<?php wp_head(); ?>
</head>
<body style="background: var(--color-black-blue);">
<style>
html.--blue-body {
background: var(--color-black-blue) !important;
}
/* html.--regular-color-body {
background: var(--color-bg-grey) !important;
} */
.preloader {
position: fixed;
z-index: 500;
left: 0;
top: 0;
right: 0;
bottom: 0;
display: none;
padding-right: 17px;
background: var(--color-black-blue);
}
.preloader.-visible {
display: block;
}
.preloader-img {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
display: block;
width: min(350px, 80%);
height: min(130px, 50%);
}
.preloader-img lottie-player {
display: block;
width: 100%;
height: 100%;
}
</style>
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<div class="preloader -visible">
<div class="preloader-img">
<lottie-player src="<?php echo get_template_directory_uri(); ?>/assets/images/preloader.json" background="transparent" speed="1" loop autoplay></lottie-player>
</div>
</div>
<script>
// Scroll lock
function lockScroll() {
const html = document.documentElement;
const body = document.body;
const scrollTop = window.scrollY;
html.classList.add('-scroll-lock');
body.classList.add('-scroll-lock');
document.body.scrollTo(0, scrollTop);
html.setAttribute('data-scroll', scrollTop);
}
// Allow animations if JS support is enabled
document.body.classList.add('-allow-animations');
// Don't show preloader again if the page was visited
let preloader = document.querySelector('.preloader');
let fullPageUrl = window.location.href;
let visitedPages = window.localStorage.getItem('visited-pages');
let visitedPagesArr = visitedPages ? visitedPages.split(' ') : '';
let isPreloaderLoaded = visitedPagesArr.includes(fullPageUrl);
if (preloader && !isPreloaderLoaded) {
lockScroll();
}
</script>
<?php
$header = get_field('header', 'option');
$template_directory = get_template_directory_uri();
$srcset = 'srcset="' . $template_directory . '/assets/images/lazyload.png"';
$header_color = false;
if (is_singular('solution')) {
$main = get_field('main');
if ($main['block_color'] == 'light') {
$header_color = '-white-bg';
}
}
if (is_page_template(['solutions.php', 'blog.php', 'faq.php', 'terms.php']) || is_404() || is_singular('post')) {
$header_color = '-white-bg';
}
?>
<div class="header-wrapper">
<header class="header <?php echo $header_color; ?>">
<div class="header-blured-bg"></div>
<div class="container">
<div class="header__inner">
<a href="<?php echo get_home_url(); ?>" class="logo">
<?php
$logo = $header['logo'];
if ($logo['white_version'] && $logo['dark_version']) :
?>
<img src="<?php echo $logo['white_version']['url']; ?>" alt="<?php echo $logo['white_version']['alt']; ?>">
<img src="<?php echo $logo['dark_version']['url']; ?>" alt="<?php echo $logo['dark_version']['alt']; ?>">
<?php
endif;
?>
</a>
<div class="header__menu">
<?php
foreach($header['menu'] as $item) :
if ($item['is_this_dropdown_list'] && $item['title_for_dropdown']) :
?>
<div class="header__accordion" data-custom-lazyload-trigger>
<span class="header__accordion-opener body-2 body-2-medium link">
<?php echo $item['title_for_dropdown']; ?>
</span>
<div class="header__accordion-content">
<div class="container">
<div class="header__accordion-menu">
<?php
$inner_list = $item['dropdown_inner_list'];
foreach($inner_list as $post_obj) :
$preview = get_field('preview', $post_obj->ID);
$small_preview = $preview['small_preview'];
if ($small_preview['img']['white_version'] && $small_preview['img']['dark_version']) :
?>
<a href="<?php echo get_the_permalink($post_obj->ID); ?>" class="header__accordion-item">
<div class="img">
<img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $small_preview['img']['white_version']['url']; ?>" alt="<?php echo $small_preview['img']['white_version']['alt']; ?>">
<img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $small_preview['img']['dark_version']['url']; ?>" alt="<?php echo $small_preview['img']['dark_version']['alt']; ?>">
</div>
<div class="info">
<p class="title text-3 link__bold">
<?php
if ($small_preview['title']) {
echo $small_preview['title'];
} else {
echo $post_obj->post_title;
}
?>
</p>
<p class="text body-2 --weight500">
<?php echo $small_preview['short_description']; ?>
</p>
</div>
</a>
<?php
endif;
endforeach;
?>
</div>
<?php
$bottom_link = get_link_group_field($item['link_on_bottom_of_dropdown']);
if ($bottom_link) :
?>
<a class="button__transparent body-2 body-2-medium arrow-link" href="<?php echo $bottom_link['url']; ?>" <?php echo $bottom_link['target']; ?>><?php echo $bottom_link['title']; ?></a>
<?php
endif;
?>
</div>
</div>
</div>
<?php
else:
$link = get_link_group_field($item['link']);
if ($link) :
?>
<a class="body-2 body-2-medium link" href="<?php echo $link['url']; ?>" <?php echo $link['target']; ?>> <?php echo $link['title']; ?> </a>
<?php
endif;
endif;
endforeach;
?>
</div>
<?php
if ($header['button']) :
?>
<div class="header__button modal-form-open"><?php echo $header['button']; ?></div>
<?php
endif;
?>
<div class="mobile-menu-opener">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
<div class="mobile-menu" data-custom-lazyload-trigger>
<div class="container mobile-menu__wrapper">
<div class="mobile-menu__scroller">
<div class="mobile-menu-inner">
<?php
foreach($header['menu'] as $item) :
if ($item['is_this_dropdown_list'] && $item['title_for_dropdown']) :
?>
<div class="header__accordion --accordion">
<div class="header__accordion-opener-container">
<span class="header__accordion-opener title-3 mobile__title-3 link --accordion__open">
<?php echo $item['title_for_dropdown']; ?>
</span>
<?php
$bottom_link = get_link_group_field($item['link_on_bottom_of_dropdown']);
if ($bottom_link) :
?>
<a class="title text-3 mobile__text-2 --weight500" href="<?php echo $bottom_link['url']; ?>" <?php echo $bottom_link['target']; ?>><?php echo $bottom_link['title']; ?></a>
<?php
endif;
?>
</div>
<div class="--accordion__content-container">
<div class="header__accordion-content --accordion__content">
<?php
$inner_list = $item['dropdown_inner_list'];
foreach($inner_list as $post_obj) :
$preview = get_field('preview', $post_obj);
$small_preview = $preview['small_preview'];
if ($small_preview['img']['dark_version']) :
?>
<a href="<?php echo get_the_permalink($post_obj->ID); ?>" class="header__accordion-item">
<div class="img">
<img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $small_preview['img']['dark_version']['url']; ?>" alt="<?php echo $small_preview['img']['dark_version']['alt']; ?>">
</div>
<div class="info">
<p class="title text-3 mobile__text-2 --weight500">
<?php
if ($small_preview['title']) {
echo $small_preview['title'];
} else {
echo $post_obj->post_title;
}
?>
</p>
</div>
</a>
<?php
endif;
endforeach;
?>
</div>
</div>
</div>
<?php
else:
$link = get_link_group_field($item['link']);
if ($link) :
?>
<a class="title-3 mobile__title-3 link" href="<?php echo $link['url']; ?>" <?php echo $link['target']; ?>> <?php echo $link['title']; ?> </a>
<?php
endif;
endif;
endforeach;
?>
</div>
<div class="social-list">
<?php
$contacts = get_field('contacts', 'option');
foreach($contacts['socials'] as $item) :
if ($item['img'] && $item['link']) :
?>
<a href="<?php echo $item['link']['url']; ?>" <?php echo $item['link']['target']; ?>>
<img class="-lazyload" <?php echo $srcset; ?> src="<?php echo $item['img']['url']; ?>" alt="<?php echo $item['img']['alt']; ?>">
</a>
<?php
endif;
endforeach;
?>
</div>
</div>
<?php
if ($header['button']) :
?>
<div class="button__blue modal-form-open"><?php echo $header['button']; ?></div>
<?php
endif;
?>
</div>
</div>
</header>
</div>
