beenull/themes-wordpress
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update the Hever theme to have the mobile nav on the side.

Browse source
This commit is contained in:
Enej Bajgoric 2020-12-04 14:55:04 -08:00 committed by Maggie Cabrera
parent 666685be85
commit 068e10dc9a
4 changed files with 90 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
hever/functions.php
View file

@ -99,6 +99,9 @@ if ( ! function_exists( 'hever_setup' ) ) :
),
)
);
// Add mobile-on-side body class.
add_filter( 'body_class', 'varia_mobile_nav_on_side' );
}
endif;
add_action( 'after_setup_theme', 'hever_setup', 12 );

31
hever/sass/_extra-child-theme.scss
View file

@ -491,3 +491,34 @@ article .entry-header .entry-title,
width: 100%;
}
}
// Updates the Mobile Navigation to be next to the site title.
.mobile-nav-side .site-title,
.mobile-nav-side .site-description {
@include media(mobile-only) {
margin-right: 110px; /** This number is magic. */
}
}
.mobile-nav-side .main-navigation {
@include media(mobile-only) {
#toggle-menu {
position: absolute;
top: 2 * $baseline-unit;
right: 2 * $baseline-unit;
}
.menu-main-menu-container {
background: #{map-deep-get($config-global, "color", "background", "light") };
margin:0 ( -2 * $baseline-unit );
padding: 0 (2 * $baseline-unit) $baseline-unit;
.sub-menu {
padding-left: 2 * $baseline-unit;
}
a {
padding: $baseline-unit 0;
line-height: 1;
}
}
}
}

28
hever/style-rtl.css
View file

@ -4468,6 +4468,34 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
width: 100%;
}
@media only screen and (max-width: 559px) {
.mobile-nav-side .site-title,
.mobile-nav-side .site-description {
margin-left: 110px;
/** This number is magic. */
}
}
@media only screen and (max-width: 559px) {
.mobile-nav-side .main-navigation #toggle-menu {
position: absolute;
top: 16px;
left: 16px;
}
.mobile-nav-side .main-navigation .menu-main-menu-container {
background: #F8F8F8;
margin: 0 -16px;
padding: 0 16px 8px;
}
.mobile-nav-side .main-navigation .menu-main-menu-container .sub-menu {
padding-right: 16px;
}
.mobile-nav-side .main-navigation .menu-main-menu-container a {
padding: 8px 0;
line-height: 1;
}
}
/**
* Full Site Editing
* - Full Site Editing overrides

28
hever/style.css
View file

@ -4497,6 +4497,34 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
width: 100%;
}
@media only screen and (max-width: 559px) {
.mobile-nav-side .site-title,
.mobile-nav-side .site-description {
margin-right: 110px;
/** This number is magic. */
}
}
@media only screen and (max-width: 559px) {
.mobile-nav-side .main-navigation #toggle-menu {
position: absolute;
top: 16px;
right: 16px;
}
.mobile-nav-side .main-navigation .menu-main-menu-container {
background: #F8F8F8;
margin: 0 -16px;
padding: 0 16px 8px;
}
.mobile-nav-side .main-navigation .menu-main-menu-container .sub-menu {
padding-left: 16px;
}
.mobile-nav-side .main-navigation .menu-main-menu-container a {
padding: 8px 0;
line-height: 1;
}
}
/**
* Full Site Editing
* - Full Site Editing overrides