Reply To: Upgrade from 1.4 to 1.4.1

Did you replace all the files or just the css for the update? It appears you updated the CSS file but there were other files that were updated for 1.4.1 In this case the responsive menu icon is showing up in your source code as a class instead of an ID. The CSS in 1.4.1 for the responsive icon uses ID’s and 1.4 used “classes”….I updated the CSS and the Responsive Menu file located in the folder labeled js inside the theme.

You can update and replace the responsive-menu.js in the js folder with the following code –

jQuery(function( $ ){

	$("header .genesis-nav-menu, .nav-primary .genesis-nav-menu").addClass("responsive-menu").before('<div class="responsive-menu-icon"></div>');

	$(".responsive-menu-icon").click(function(){
		$(this).next("header .genesis-nav-menu, .nav-primary .genesis-nav-menu").slideToggle();
	});

	$(window).resize(function(){
		if(window.innerWidth > 768) {
			$("header .genesis-nav-menu, .nav-primary .genesis-nav-menu, nav .sub-menu").removeAttr("style");
			$(".responsive-menu > .menu-item").removeClass("menu-open");
		}
	});

	$(".responsive-menu > .menu-item").click(function(event){
		if (event.target !== this)
		return;
			$(this).find(".sub-menu:first").slideToggle(function() {
			$(this).parent().toggleClass("menu-open");
		});
	});

});

Copy/Paste the above code and replace the entire file, and that will change the class to an ID and should instantly fix it. As mentioned earlier the updated code above will also allow the Primary Menu to use the icon as well.

****************

For the logo –

Look for the responsive section labeled should be around line 4076 in your style.css-

/* iPads (portrait)
--------------------------------------------- */

@media only screen and (max-width: 1023px) {

Then add the following code in this section –

.site-title a {
    background-position: center top !important;
    background-size: contain !important;
}

That will allow it to resize and it will also center on mobile and tablet devices.

Since your logo is directly at the top when viewed on mobile devices, you can add space by adding this to the top of your .head-wrap (header/logo area) like this –

.head-wrap {
    padding-top: 20px;
}

Add this under the same code above

Let me know if that works.