Skip to content

Commit

Permalink
Submenu design changes-1
Browse files Browse the repository at this point in the history
  • Loading branch information
@jatinbphp
jatinbphp committed Mar 29, 2024
1 parent 18c947a commit 86d56cb
Show file tree
Hide file tree
Showing 4 changed files with 220 additions and 91 deletions.
176 changes: 88 additions & 88 deletions assets/js/init.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -267,11 +267,11 @@
active.removeClass('active').hide();
$('.bgrs-holder section').eq(active.index()).removeClass('active').hide();
all.body.removeClass('switching');
if($('.footer').hasClass('active')){
all.body.addClass('footer-active');
} else {
all.body.removeClass('footer-active');
}
if($('.footer').hasClass('active')){
all.body.addClass('footer-active');
} else {
all.body.removeClass('footer-active');
}
sideNav.children().removeClass('faded')
clearTimeout(runningTimeout);
runningTimeout = null;
Expand Down Expand Up @@ -525,7 +525,7 @@
}
}
})
$('.mobile-scroll-indicator').click(function(e) {
$('.mobile-scroll-indicator').click(function(e) {
e.preventDefault();
if (!all.body.hasClass('annual-report')) {
if (!$('.sections-holder section.active').is(':last-child'))
Expand Down Expand Up @@ -661,17 +661,17 @@
if (all.common.animatedOffsets[i].top - all.distanceFromTop < currOffset)
curr.addClass('in-view');
});
/*
+ Add / remove sticky header */
if (all.distanceFromTop > 0 && all.device == 'desktop' && !all.body.hasClass('home')) {
if (!all.body.hasClass('sticky-header')) {
all.body.addClass('sticky-header');
}
} else if (!all.body.hasClass('annual-report')) {
all.body.removeClass('sticky-header');
}
/*
+ Add / remove sticky header */
if (all.distanceFromTop > 0 && all.device == 'desktop' && !all.body.hasClass('home')) {
if (!all.body.hasClass('sticky-header')) {
all.body.addClass('sticky-header');
}
} else if (!all.body.hasClass('annual-report')) {
all.body.removeClass('sticky-header');
}

if( !all.body.hasClass('home') && !all.body.hasClass('annual-report')) {
all.distanceFromTop <= 0 ?
Expand Down Expand Up @@ -761,12 +761,12 @@
if (!this.desktopNavBuilt) {
$('header nav > .main-nav > li').each(function (i) {
var curr = $(this);
if (curr.children('ul').length) {
/*if (curr.children('ul').length) {
curr.attr('data-order', i);
clonedNav = curr.children('ul').clone(true, true);
$('<li />').appendTo('.sub-nav > ul').attr('data-order', i).append(clonedNav);
curr.children('ul').remove();
}
}*/
})
$('header nav ul').show();
this.navOpened = false;
Expand Down Expand Up @@ -970,7 +970,7 @@
clearTimeout(subNavHoveredTimeout);
subNavHoveredTimeout = null;
}, 350);
});
});

var subnavLiHoverTimeout = null;

Expand Down Expand Up @@ -1138,7 +1138,7 @@
text = curr.prev().text(),
currIndex = curr.parents('li').index();
curr.parents('li').addClass('with-sub-nav');
curr.remove();
/*curr.remove();*/
$('<div class="sub-nav" data-order="' + currIndex + '"><a class="back-btn">' + text + '</a></div>').appendTo('header .holder').append(cloned);
})

Expand Down Expand Up @@ -1704,73 +1704,73 @@

$('.bgrs-holder section:first-child').addClass('active');

// NEWS SEARCH
$('.search-trigger').click(function(){
setTimeout(function() {
$('.search-field').focus();
}, 200);
$(this).parents('.news-top-inner').addClass('search-active');
return false;
});
$('.search-close').click(function(){
$(this).parents('.news-top-inner').removeClass('search-active');
return false;
});

// Scroll to hero
$('.to-content').click(function(){
$('html, body').animate({
scrollTop: $("#content-scroll-to").offset().top
}, 1000);
});

// Video section functionality
$('.video-outer.local span').click(function() {
var curr = $(this);
curr.prev().get(0).play();
curr.parent().addClass('playing');
})
$('.video-outer.external.youtube span').click(function() {
var curr = $(this);
curr.parent().addClass('playing');
$(".external-video iframe")[0].src += "?autoplay=1";
});
$('.video-outer.external.vimeo span').click(function() {
var curr = $(this);
//curr.parent().addClass('playing');
curr.fadeOut(1000);
$(".external-video iframe")[0].src += "&autoplay=1";
});

// News filter trigger
$('.filter-trigger').click(function(){
$('.news-content aside').addClass('active');
$('html').addClass('overlay-active');
$('html, body').animate({
scrollTop: $("#news-scroll-indicator").offset().top
}, 500);
return false;
});
$('.close-aside').click(function(){
$('.news-content aside').removeClass('active');
$('html').removeClass('overlay-active');
return false;
});
// Team popup
$('.team-popup-trigger').click(function(){
var itemId = $(this).attr('id');
$('[data-hash="' + itemId + '"]').addClass('active');
$('.team-popups-holder').addClass('opened');
$('html').addClass('overlay-active');
return false;
});
$('.team-popups-holder .exit').click(function(){
$('.team-popups-holder').removeClass('opened');
$('.popup-wrapper').removeClass('active');
$('html').removeClass('overlay-active');
return false;
});
// NEWS SEARCH
$('.search-trigger').click(function(){
setTimeout(function() {
$('.search-field').focus();
}, 200);
$(this).parents('.news-top-inner').addClass('search-active');
return false;
});
$('.search-close').click(function(){
$(this).parents('.news-top-inner').removeClass('search-active');
return false;
});

// Scroll to hero
$('.to-content').click(function(){
$('html, body').animate({
scrollTop: $("#content-scroll-to").offset().top
}, 1000);
});

// Video section functionality
$('.video-outer.local span').click(function() {
var curr = $(this);
curr.prev().get(0).play();
curr.parent().addClass('playing');
})
$('.video-outer.external.youtube span').click(function() {
var curr = $(this);
curr.parent().addClass('playing');
$(".external-video iframe")[0].src += "?autoplay=1";
});
$('.video-outer.external.vimeo span').click(function() {
var curr = $(this);
//curr.parent().addClass('playing');
curr.fadeOut(1000);
$(".external-video iframe")[0].src += "&autoplay=1";
});

// News filter trigger
$('.filter-trigger').click(function(){
$('.news-content aside').addClass('active');
$('html').addClass('overlay-active');
$('html, body').animate({
scrollTop: $("#news-scroll-indicator").offset().top
}, 500);
return false;
});
$('.close-aside').click(function(){
$('.news-content aside').removeClass('active');
$('html').removeClass('overlay-active');
return false;
});
// Team popup
$('.team-popup-trigger').click(function(){
var itemId = $(this).attr('id');
$('[data-hash="' + itemId + '"]').addClass('active');
$('.team-popups-holder').addClass('opened');
$('html').addClass('overlay-active');
return false;
});
$('.team-popups-holder .exit').click(function(){
$('.team-popups-holder').removeClass('opened');
$('.popup-wrapper').removeClass('active');
$('html').removeClass('overlay-active');
return false;
});


if (all.body.hasClass('page-template-tpl_timeline')) {
Expand Down
79 changes: 79 additions & 0 deletions functions.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -146,3 +146,82 @@ function wpPostsByCategory($atts)
}
// Add a shortcode
add_shortcode('category_posts', 'wpPostsByCategory');

if (!class_exists('CustomMenuHierarchyClass')) {
class CustomMenuHierarchyClass extends Walker_Nav_Menu
{
// add classes to ul sub-menus
function start_lvl(&$output, $depth = 0, $args = NULL)
{
// depth dependent classes
$indent = ($depth > 0 ? str_repeat("\t", $depth) : ''); // code indent
$display_depth = ($depth + 1); // because it counts the first submenu as 0
$classes = array(
'',
($display_depth % 2 ? 'menu-odd' : 'menu-even'),
($display_depth >= 2 ? 'menu__subsub-list' : 'menu__sub-list'),
'menu-depth-' . $display_depth
);
$class_names = implode(' ', $classes);

// build html
if ($display_depth === 1) :

$output .= "\n" . $indent . '<ul class="' . $class_names . '">' . "\n";

elseif ($display_depth === 2) :

$output .= "\n" . $indent . '<ul class="' . $class_names . '">' . "\n";

else :
$output .= "\n" . $indent . '<ul class="' . $class_names . '">' . "\n";

endif;
}

// add main/sub classes to li's and links
function start_el(&$output, $item, $depth = 0, $args = NULL, $id = 0)
{
global $wp_query;
$indent = ($depth > 0 ? str_repeat("\t", $depth) : ''); // code indent

// depth dependent classes
$depth_classes = array(
($depth == 0 ? 'menu__item' : ''),
($depth == 1 ? 'menu__sub-item' : ''),
($depth >= 2 ? 'menu__subsub-item' : ''),
($depth % 2 ? 'menu-item-odd' : 'menu-item-even'),
'menu-item-depth-' . $depth
);
$depth_class_names = esc_attr(implode(' ', $depth_classes));

// passed classes
$classes = empty($item->classes) ? array() : (array) $item->classes;
$class_names = esc_attr(implode(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item)));

// build html
$output .= $indent . '<li id="nav-menu-item-' . $item->ID . '" class="' . $depth_class_names . ' ' . $class_names . '">';

// link attributes
$attributes = !empty($item->attr_title) ? ' title="' . esc_attr($item->attr_title) . '"' : '';
$attributes .= !empty($item->target) ? ' target="' . esc_attr($item->target) . '"' : '';
$attributes .= !empty($item->xfn) ? ' rel="' . esc_attr($item->xfn) . '"' : '';
$attributes .= !empty($item->url) ? ' href="' . esc_attr($item->url) . '"' : '';
$attributes .= ' class="' . ($depth == 0 ? 'menu__link' : '') . ($depth == 1 ? 'menu__sub-link' : '') . ($depth >= 2 ? 'menu__subsub-link' : '') . '"';

$item_output = sprintf(
'%1$s<a%2$s>%3$s%4$s%5$s</a>%6$s',
$args->before,
$attributes,
$args->link_before,
apply_filters('the_title', $item->title, $item->ID),
$args->link_after,
$args->after
);

// build html
$output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
}

}
}
9 changes: 8 additions & 1 deletion header.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,14 @@ function gtag() { dataLayer.push(arguments); }
</a>
<nav>
<ul class="main-nav">
<?php wp_nav_menu(array('menu' => 'Main Menu', 'container' => false, 'items_wrap' => '%3$s')); ?>
<?php
wp_nav_menu(
array(
'menu' => 'Main Menu',
'container' => false, 'items_wrap' => '%3$s',
'walker' => new CustomMenuHierarchyClass()
)
); ?>
</ul>
</nav>
<a href="#" class="nav-trigger">
Expand Down
47 changes: 45 additions & 2 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@
font-size: 14px;
}
}

@media (min-width:961px) {
header .holder .logo{
width: 200px;
Expand All @@ -30,12 +29,56 @@
padding: 38px 12px;
}
}

@media (min-width:1231px) {
header .holder .logo{
width: 330px;
}
header .holder nav .main-nav li a{
padding: 38px 15px;
}
}


/* main menu design start */
header .holder{
overflow: visible !important;
}
header .holder nav .main-nav{
overflow: visible !important;
}
ul.menu__sub-list {
top: auto;
width: 220px;
position: absolute;
z-index: 9900;
text-align: left;
}
@media (min-width:819px) {
ul.menu__sub-list {
display: none !important;
}
}
@media (max-width:819px) {
.main-nav ul.menu__sub-list {
display: none !important;
}
}
header .holder nav .main-nav li:hover ul.menu__sub-list {
display: block !important;
}
.header.stay-in-view{
transform: none !important;
background: #e6fa05;
}
header .holder nav .main-nav li {
float: left;
position: relative;
}
header.stay-in-view {
-webkit-transform: none !important;
-moz-transform: none !important;
-ms-transform: none !important;
-o-transform: none !important;
transform: none !important;
background: #e6fa05;
}

0 comments on commit 86d56cb

Please sign in to comment.