kjodle/atticus-finch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Additional mobile menu changes

Browse Source 
Customizer options added, style changes
This commit is contained in:
kjodle 2016-02-13 21:25:50 -05:00
parent 0b85dd6545
commit a1481a042e
5 changed files with 1099 additions and 360 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
functions.php
View File

@ -118,23 +118,25 @@ add_action( 'widgets_init', 'atticus_finch_widgets_init' );
* Enqueue scripts and styles.
*/
function atticus_finch_scripts() {
wp_enqueue_style( 'atticus-finch-style', get_stylesheet_uri(), array (), '0.4', 'screen' );
wp_enqueue_style( 'atticus-finch-googlefont', 'http://fonts.googleapis.com/css?family=IM+Fell+English:400,400italic', 'atticus-finch-style', '0.4', 'all' );
if ( !wp_style_is( 'font-awesome.min.css', 'enqueued' ) ) {
wp_enqueue_style( 'atticus-finch-fa', 'http://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', 'atticus-finch-style', '0.4', 'all' );
}
wp_enqueue_style( 'atticus-finch-style', get_stylesheet_uri( 'atticus-finch-navigation' ), array (), '0.4', 'screen' );
wp_enqueue_style( 'atticus-finch-mobile', get_stylesheet_directory_uri() . '/styles/mobile.css', 'atticus-finch-style', '0.4', 'screen and (max-width: 640px)' );
wp_enqueue_style( 'atticus-finch-print', get_stylesheet_directory_uri() . '/styles/print.css', 'atticus-finch-style', '0.4', 'print' );
wp_enqueue_style( 'atticus-finch-menu-style', get_template_directory_uri() . '/styles/superfish.css', 'atticus-finch-style', '0.4', 'screen' );
// wp_enqueue_style( 'atticus-finch-menu-style', get_template_directory_uri() . '/styles/superfish.css', 'atticus-finch-style', '0.4', 'screen' );
wp_enqueue_script( 'atticus-finch-navigation', get_template_directory_uri() . '/js/superfish.js', array(), '0.4', true );
// wp_enqueue_script( 'atticus-finch-navigation', get_template_directory_uri() . '/js/superfish.js', array( 'jquery' ), '0.4', true );
wp_enqueue_script( 'atticus-finch-mobile-menus', get_template_directory_uri() . '/js/menumaker.js', array('jquery'), '0.4', true );
wp_enqueue_style( 'atticus-finch-menu-style', get_template_directory_uri() . '/styles/menumaker.css', 'atticus-finch-style', '0.4', 'screen' );
wp_enqueue_script( 'atticus-finch-mobile-menus', get_template_directory_uri() . '/js/menumaker.js', array( 'jquery' ), '0.4', true );
wp_enqueue_script( 'atticus-finch-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '0.4', true );

47
functions/customizer.php
View File

@ -707,6 +707,19 @@ $default_copyright = '<a rel="license" href="http://creativecommons.org/licenses
'label' => __( 'Display the top menu as', 'atticus-finch' ),
) );
$wp_customize->add_setting( 'atticus_finch_top_menu_breakpoint', array(
'type' => 'theme_mod',
'transport' => 'postMessage',
'sanitize_callback' => 'atticus_finch_sanitize_int',
'default' => 640,
) );
$wp_customize->add_control( 'atticus_finch_top_menu_breakpoint', array(
'section' => 'atticus_finch_mobile_menu_options',
'type' => 'integer',
'label' => __( 'Breakpoint to display top menu as mobile', 'atticus-finch' ),
) );
// Main Menu Options
$wp_customize->add_setting( 'atticus_finch_main_menu_name', array(
'type' => 'theme_mod',
@ -738,6 +751,19 @@ $default_copyright = '<a rel="license" href="http://creativecommons.org/licenses
'label' => __( 'Display the menu menu as', 'atticus-finch' ),
) );
$wp_customize->add_setting( 'atticus_finch_main_menu_breakpoint', array(
'type' => 'theme_mod',
'transport' => 'postMessage',
'sanitize_callback' => 'atticus_finch_sanitize_int',
'default' => 640,
) );
$wp_customize->add_control( 'atticus_finch_main_menu_breakpoint', array(
'section' => 'atticus_finch_mobile_menu_options',
'type' => 'integer',
'label' => __( 'Breakpoint to display main menu as mobile', 'atticus-finch' ),
) );
// Footer Menu Options
$wp_customize->add_setting( 'atticus_finch_footer_menu_name', array(
'type' => 'theme_mod',
@ -769,6 +795,19 @@ $default_copyright = '<a rel="license" href="http://creativecommons.org/licenses
'label' => __( 'Display the footer menu as', 'atticus-finch' ),
) );
$wp_customize->add_setting( 'atticus_finch_footer_menu_breakpoint', array(
'type' => 'theme_mod',
'transport' => 'postMessage',
'sanitize_callback' => 'atticus_finch_sanitize_int',
'default' => 640,
) );
$wp_customize->add_control( 'atticus_finch_footer_menu_breakpoint', array(
'section' => 'atticus_finch_mobile_menu_options',
'type' => 'integer',
'label' => __( 'Breakpoint to display footer menu as mobile', 'atticus-finch' ),
) );
// Miscellaneous Options
$wp_customize->add_section( 'atticus_finch_misc', array(
@ -834,10 +873,10 @@ $default_copyright = '<a rel="license" href="http://creativecommons.org/licenses
) );
// Preview some of our options
/*
if ( $wp_customize->is_preview() && ! is_admin() )
add_action( 'wp_footer', 'atticus_finch_customize_preview', 21);
/*
function themename_customize_preview() {
?>
<script type="text/javascript">
@ -899,6 +938,12 @@ function atticus_finch_sanitize_mobile_menu_type( $input ){
}
}
function atticus_finch_sanitize_int( $input ){
if( is_numeric( $input) ) {
return intval( $input );
}
}
function atticus_finch_sanitize_css( $input ) {
// wp_filter_nohtml_kses( $input );
strip_tags( $input );

18
functions/mobile-menus.php
View File

@ -5,19 +5,19 @@ function atticus_finch_mobile_menus(){
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#aboveheadermenu").menumaker({
title: "' . get_theme_mod('atticus_finch_top_menu_name') . '",
breakpoint: 640,
format: "' . get_theme_mod('atticus_finch_top_menu_type') . '"
title: "' . get_theme_mod( 'atticus_finch_top_menu_name' ) . '",
breakpoint: ' . get_theme_mod( 'atticus_finch_top_menu_breakpoint' ) . ',
format: "' . get_theme_mod( 'atticus_finch_top_menu_type' ) . '"
});
jQuery("#belowheadermenu").menumaker({
title: "' . get_theme_mod('atticus_finch_main_menu_name') . '",
breakpoint: 640,
format: "' . get_theme_mod('atticus_finch_main_menu_type') . '"
title: "' . get_theme_mod( 'atticus_finch_main_menu_name' ) . '",
breakpoint: ' . get_theme_mod( 'atticus_finch_main_menu_breakpoint' ) . ',
format: "' . get_theme_mod( 'atticus_finch_main_menu_type' ) . '"
});
jQuery("#footermenu").menumaker({
title: "' . get_theme_mod('atticus_finch_footer_menu_name') . '",
breakpoint: 640,
format: "' . get_theme_mod('atticus_finch_footer_menu_type') . '"
title: "' . get_theme_mod( 'atticus_finch_footer_menu_name' ) . '",
breakpoint: ' . get_theme_mod( 'atticus_finch_footer_menu_breakpoint' ) . ',
format: "' . get_theme_mod( 'atticus_finch_footer_menu_type' ) . '"
});
});
</script>

1037
styles/menumaker.css Normal file
View File

File diff suppressed because it is too large Load Diff

345
styles/mobile.css
View File

@ -69,348 +69,3 @@ body > footer{
/* Menumaker
Adjust as needed */
@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
margin: 0;
padding: 0;
border: 0;
list-style: none;
line-height: 1;
display: block;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#cssmenu #menu-button {
display: none;
}
#cssmenu {
font-family: Montserrat, sans-serif;
background: #333333;
}
#cssmenu > ul > li {
float: left;
}
#cssmenu.align-center > ul {
font-size: 0;
text-align: center;
}
#cssmenu.align-center > ul > li {
display: inline-block;
float: none;
}
#cssmenu.align-center ul ul {
text-align: left;
}
#cssmenu.align-right > ul > li {
float: right;
}
#cssmenu > ul > li > a {
padding: 17px;
font-size: 12px;
letter-spacing: 1px;
text-decoration: none;
color: #dddddd;
font-weight: 700;
text-transform: uppercase;
}
#cssmenu > ul > li:hover > a {
color: #ffffff;
}
#cssmenu > ul > li.has-sub > a {
padding-right: 30px;
}
#cssmenu > ul > li.has-sub > a:after {
position: absolute;
top: 22px;
right: 11px;
width: 8px;
height: 2px;
display: block;
background: #dddddd;
content: '';
}
#cssmenu > ul > li.has-sub > a:before {
position: absolute;
top: 19px;
right: 14px;
display: block;
width: 2px;
height: 8px;
background: #dddddd;
content: '';
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-ms-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
#cssmenu > ul > li.has-sub:hover > a:before {
top: 23px;
height: 0;
}
#cssmenu ul ul {
position: absolute;
left: -9999px;
}
#cssmenu.align-right ul ul {
text-align: right;
}
#cssmenu ul ul li {
height: 0;
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-ms-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
#cssmenu li:hover > ul {
left: auto;
}
#cssmenu.align-right li:hover > ul {
left: auto;
right: 0;
}
#cssmenu li:hover > ul > li {
height: 35px;
}
#cssmenu ul ul ul {
margin-left: 100%;
top: 0;
}
#cssmenu.align-right ul ul ul {
margin-left: 0;
margin-right: 100%;
}
#cssmenu ul ul li a {
border-bottom: 1px solid rgba(150, 150, 150, 0.15);
padding: 11px 15px;
width: 170px;
font-size: 12px;
text-decoration: none;
color: #dddddd;
font-weight: 400;
background: #333333;
}
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last-item > a {
border-bottom: 0;
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
color: #ffffff;
}
#cssmenu ul ul li.has-sub > a:after {
position: absolute;
top: 16px;
right: 11px;
width: 8px;
height: 2px;
display: block;
background: #dddddd;
content: '';
}
#cssmenu.align-right ul ul li.has-sub > a:after {
right: auto;
left: 11px;
}
#cssmenu ul ul li.has-sub > a:before {
position: absolute;
top: 13px;
right: 14px;
display: block;
width: 2px;
height: 8px;
background: #dddddd;
content: '';
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-ms-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
#cssmenu.align-right ul ul li.has-sub > a:before {
right: auto;
left: 14px;
}
#cssmenu ul ul > li.has-sub:hover > a:before {
top: 17px;
height: 0;
}
#cssmenu.small-screen {
width: 100%;
}
#cssmenu.small-screen ul {
width: 100%;
display: none;
}
#cssmenu.small-screen.align-center > ul {
text-align: left;
}
#cssmenu.small-screen ul li {
width: 100%;
border-top: 1px solid rgba(120, 120, 120, 0.2);
}
#cssmenu.small-screen ul ul li,
#cssmenu.small-screen li:hover > ul > li {
height: auto;
}
#cssmenu.small-screen ul li a,
#cssmenu.small-screen ul ul li a {
width: 100%;
border-bottom: 0;
}
#cssmenu.small-screen > ul > li {
float: none;
}
#cssmenu.small-screen ul ul li a {
padding-left: 25px;
}
#cssmenu.small-screen ul ul ul li a {
padding-left: 35px;
}
#cssmenu.small-screen ul ul li a {
color: #dddddd;
background: none;
}
#cssmenu.small-screen ul ul li:hover > a,
#cssmenu.small-screen ul ul li.active > a {
color: #ffffff;
}
#cssmenu.small-screen ul ul,
#cssmenu.small-screen ul ul ul,
#cssmenu.small-screen.align-right ul ul {
position: relative;
left: 0;
width: 100%;
margin: 0;
text-align: left;
}
#cssmenu.small-screen > ul > li.has-sub > a:after,
#cssmenu.small-screen > ul > li.has-sub > a:before,
#cssmenu.small-screen ul ul > li.has-sub > a:after,
#cssmenu.small-screen ul ul > li.has-sub > a:before {
display: none;
}
#cssmenu.small-screen #menu-button {
display: block;
padding: 17px;
color: #dddddd;
cursor: pointer;
font-size: 12px;
text-transform: uppercase;
font-weight: 700;
}
#cssmenu.small-screen #menu-button:after {
position: absolute;
top: 22px;
right: 17px;
display: block;
height: 4px;
width: 20px;
border-top: 2px solid #dddddd;
border-bottom: 2px solid #dddddd;
content: '';
}
#cssmenu.small-screen #menu-button:before {
position: absolute;
top: 16px;
right: 17px;
display: block;
height: 2px;
width: 20px;
background: #dddddd;
content: '';
}
#cssmenu.small-screen #menu-button.menu-opened:after {
top: 23px;
border: 0;
height: 2px;
width: 15px;
background: #ffffff;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
#cssmenu.small-screen #menu-button.menu-opened:before {
top: 23px;
background: #ffffff;
width: 15px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#cssmenu.small-screen .submenu-button {
position: absolute;
z-index: 99;
right: 0;
top: 0;
display: block;
border-left: 1px solid rgba(120, 120, 120, 0.2);
height: 46px;
width: 46px;
cursor: pointer;
}
#cssmenu.small-screen .submenu-button.submenu-opened {
background: #262626;
}
#cssmenu.small-screen ul ul .submenu-button {
height: 34px;
width: 34px;
}
#cssmenu.small-screen .submenu-button:after {
position: absolute;
top: 22px;
right: 19px;
width: 8px;
height: 2px;
display: block;
background: #dddddd;
content: '';
}
#cssmenu.small-screen ul ul .submenu-button:after {
top: 15px;
right: 13px;
}
#cssmenu.small-screen .submenu-button.submenu-opened:after {
background: #ffffff;
}
#cssmenu.small-screen .submenu-button:before {
position: absolute;
top: 19px;
right: 22px;
display: block;
width: 2px;
height: 8px;
background: #dddddd;
content: '';
}
#cssmenu.small-screen ul ul .submenu-button:before {
top: 12px;
right: 16px;
}
#cssmenu.small-screen .submenu-button.submenu-opened:before {
display: none;
}
#cssmenu.small-screen.select-list {
padding: 5px;
}