[CarelvdW]

Hi,

I’m working with the BBQ theme and have some issues with the responsive layout on a iphone with the menu in the grid layout. Also the line at the bottom of the menu items is going to wide in a normal screen.
The grid layout is not going to the smaller iPhone layout at all.
As far as I can see now, the BBQ theme will do a great job for me if I can solve and change some issues.

[Juanfra Aldasoro]

Hi,

Thanks for writing.

Would you please try adding the following CSS into your custom.css file?

@media screen and (max-width: 1024px) {
body.tax-menu-category .has-subcategories .menu-box-subcategory,
body.tax-menu-category .has-subcategories .menu-card{
	width: 100% !important;
	margin: 0;
}
}

Best,
Juan.

[CarelvdW]

Hi Juan,

Thanx for the quick answer! This solves the problem for the layout on a iPhone.
Still in my normal browser the line at the bottom of the menu items is going to wide (in my case you can see at trattoria, vino and cucina.

Further, is there an possibility in the screen Add New Menu Item to delete or not showing all the BBQ settings except Price and or set Drink or non food item and Prevent this item for being clickable over the menu templates by default as marked?

Thx for the nice theme ans support so far!

[Juanfra Aldasoro]

Hi There,

I see, try with this CSS:

.menu-box{ border-bottom: none !important; }

Unfortunately there’s no way to set a default value for those options.

Best,
Juan.

[CarelvdW]

Thx, at this way the whole line is deleted but that also solves the problem. There is no way just making it smaller so it stays in line like in an normal page like catering?

Thx again!

[Juanfra Aldasoro]

Yes,

Try this instead:

body.tax-menu-category .has-subcategories .menu-card{
    width: 100%;
}

Best,
Juan.

[CarelvdW]

Hi Juan,

With the last option, the line at the bottom is ok but the grid is not in two colomns anymore. It looks like the colums are to wide to fit the avalable total width

[CarelvdW]

(I now returned to the .menu-box{ border-bottom: none !important; } option but you may change it if you want to see)

[Juanfra Aldasoro]

Hello there,

I went to your site and it shows white. Please let me know when the site is up again.

Best,
Juan

[CarelvdW]

Sorry, it is ok again now! Was looking how the social media links open in a new window (blank) page.

[Juanfra Aldasoro]

Hi,

Thanks.

We’re working on this isssue for the next version. Would you try the following CSS:

body.tax-menu-category .has-subcategories .menu-card{
width:100%;
}

body.tax-menu-category .has-subcategories *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing:	border-box;
	box-sizing:		 border-box;
}

body.tax-menu-category .has-subcategories .menu-box-subcategory {
    padding: 0 50px 15px 0;
    width: 50% !important;
margin:0;
}

Remove the border-bottom removal please.

Best,
Juan.

[CarelvdW]

Hi Juan,

This is working for the line at the bottom but the right side of the right menu colomn is not lining correct anymore…. I think the best option for now is the remove the border bottom.

An other thing I try to figure out: If you place the embed the Google Maps code with an iframe size of 960 by 300 like in your life demo, it displays at 960 by 570 dispite also in your contact page template is 960 by 300…

[Juanfra Aldasoro]

Thanks for the follow up.

We’re working on that as well. We’ve added some classes to make it responsive to all devices and it is expanded to the map aspect ratio.

Best,
Juan.

[CarelvdW]

Thx so far! Have a nice weekend!

[Juanfra Aldasoro]

Thanks for your patience.

Have a nice weekend you too 🙂

Best,
Juan.