Mobile issues with Anitya theme
Permalink
Hey there,
Sorry if this should be under a different forum. I'm just at a loss as the developer won't reply to ANY of my messages. I'm hoping someone might have a little insight for me.
I'm having some issues with mobile and maybe I'm missing something. The site ishttp://peachfest.com
I am trying to set the "Display the stack 'Site Logo' on the mobile nav" to ON in Anyita Navigation Options and when I choose to save it, it never saves. It always defaults to off. I cannot see my logo on mobile. There IS a logo in the Site Logo stack.
On mobile devices, the top black box to the left of the 3 horizontal menu lines is so big it takes up 1/3 of the mobile screen. I would like to reduce the size of that? Or will the logo eventually show up there and it needs to be that deep?
Also on mobile, the header content that covers the image slider that renders on a desktop beautifully, can't been seen in it's entirety on mobile. It gets cut off as you scroll down and the image also gets chopped off terribly.
The mega menu does not register on a mobile device. I can't see 14 pages on mobile. Mega menu (on a desktop) is the menu that pops up when you hover over the Events tab.
Also, on the teal coloured main areas on desktop, I have to set padding & margins so that the text does not run off of the page, but that makes the text squished on mobile devices.
For example, with all padding and margins set at 0 on the Peachfest Royalty page, the text hits the far right side of the screen, but is ok on mobile. As soon as I add padding/margins on the right side, it gets shifted over to the centre of the screen on mobile.
The majority of users are going to view this website on their mobile device when they come to the festival to see what events they can watch. This is a 'huge' free family festival that really needs a functional website.
Any insight is so so so appreciated.
Thank you in advance.
Sorry if this should be under a different forum. I'm just at a loss as the developer won't reply to ANY of my messages. I'm hoping someone might have a little insight for me.
I'm having some issues with mobile and maybe I'm missing something. The site ishttp://peachfest.com
I am trying to set the "Display the stack 'Site Logo' on the mobile nav" to ON in Anyita Navigation Options and when I choose to save it, it never saves. It always defaults to off. I cannot see my logo on mobile. There IS a logo in the Site Logo stack.
On mobile devices, the top black box to the left of the 3 horizontal menu lines is so big it takes up 1/3 of the mobile screen. I would like to reduce the size of that? Or will the logo eventually show up there and it needs to be that deep?
Also on mobile, the header content that covers the image slider that renders on a desktop beautifully, can't been seen in it's entirety on mobile. It gets cut off as you scroll down and the image also gets chopped off terribly.
The mega menu does not register on a mobile device. I can't see 14 pages on mobile. Mega menu (on a desktop) is the menu that pops up when you hover over the Events tab.
Also, on the teal coloured main areas on desktop, I have to set padding & margins so that the text does not run off of the page, but that makes the text squished on mobile devices.
For example, with all padding and margins set at 0 on the Peachfest Royalty page, the text hits the far right side of the screen, but is ok on mobile. As soon as I add padding/margins on the right side, it gets shifted over to the centre of the screen on mobile.
The majority of users are going to view this website on their mobile device when they come to the festival to see what events they can watch. This is a 'huge' free family festival that really needs a functional website.
Any insight is so so so appreciated.
Thank you in advance.
Thanks for reviewing it. Yes it needs some tweeks. The developer won't reply to any support questions I ask?
Fingers crossed for solutions soon or the site will be re-worked elsewhere.
Fingers crossed for solutions soon or the site will be re-worked elsewhere.
Hi designsforchange,
Regarding the size of the navigation at smaller screen widths, you can try this CSS:
The header content that covers the image slider has to be customized using CSS based on the breakpoints.
I can see that the Events sub pages are not displayed in the mobile navigation. This will need to discussed with the theme developer.
You can try this CSS, for the content in the "teal" sections after you remove the padding that you added:
Regarding the size of the navigation at smaller screen widths, you can try this CSS:
.small-display-nav-bar-inner { min-height: 45px; } #mmenu { top: 45px; }
The header content that covers the image slider has to be customized using CSS based on the breakpoints.
I can see that the Events sub pages are not displayed in the mobile navigation. This will need to discussed with the theme developer.
You can try this CSS, for the content in the "teal" sections after you remove the padding that you added:
.area-space-l { padding: 90px 29px; }
Hi MrKDilkington,
Thank you for your input. I've reached out to the theme developer and can't get any response or acknowledgement what so ever. I will test your suggestions.
Thanks again.
Thank you for your input. I've reached out to the theme developer and can't get any response or acknowledgement what so ever. I will test your suggestions.
Thanks again.
You got some mixed content (ssl, non ssl) on your website.
The themes demo does not shows the logo on mobile to (needs some css tweaks)
The mobile menu needs also some css tweaks.
Overall needs this theme many modifications....
Kind Regards