[Resolved] Menu not showing right on safari because of uncompatibility with Bootstrap 4

[Author]

Posts

[Luigi Martulli]

I was having an issue with template's columns, check this thread:

https://toolset.com/forums/topic/archive-not-showing-on-full-width/

But once I've activated the option: "Toolset should load Bootstrap 3.0" now my menu is broken when you use safari browser.

I've checked with the theme support and after we deactivated toolset, the menu was fixed. this is their explanation then:

"Hi Cristian

Toolset uses a old version of Bootstrap and UM theme uses the Bootstrap version 4, hence all the CSS conflicts.

Solution I found from Toolset Forum: You can go to Toolset > Settings and specify that Bootstrap is not being used on the site, meaning Bootstrap CSS and JS will not be loaded by Toolset.

Although they said they will make Toolset compatible with Bootstrap 4 soon.

Forum: https://toolset.com/forums/topic/toolset-breaking-my-bootstrap-4-layout/"

Can you please help me to fix the menu then?

Thanks

C

PD: BTW please can you delete the login info detailed on my previous thread? https://toolset.com/forums/topic/archive-not-showing-on-full-width/
I can't edit it, and I've just realized is public.

[Minesh]

Hello. Thank you for contacting the Toolset support.

Well - yes, the work to make Toolset plugins compatible with Bootstrap 4 is ongoing and there is no ETA on it yet. But I will add your voice to our internal ticket that will help our Devs to put this task on higher priority.

[Luigi Martulli]

Ok, that I already knew, but thanks anyway.
Meanwhile, I need to make it work with my actual theme, can you please help me? the issue is mainly with safari browser and the main menu of my theme.

Or... can you help me to make archive list columns (responsive) without the need of toolset loading an old version of bootstrap? like in here:

hidden link

thanks.

[Minesh]

Well - what if you disable the bootstrap loading from Toolset settings?
You can go to Toolset > Settings and specify that Bootstrap is not being used on the site,
( meaning Bootstrap CSS and JS will not be loaded by Toolset but from your theme only)

See the image - I can see the menu, it display fine:
=> hidden link

[Luigi Martulli]

- If I deactivate it, then the list view columns from a toolset template will not display correctly, please read carefully the previous ticket:
https://toolset.com/forums/topic/archive-not-showing-on-full-width/

- about your screenshot, are you using safari browser?? Check screenshot attached

Thanks

[Minesh]

Well - when I checked the HTML that is generated by view you added to following page:
=> hidden link

I see there is a missing row class to the row that right now seems to be the div that wraps all the divs with class "col-sm-3":

<div class="  ">

What if you try to disable the bootstrap loading from Toolset and add the row class:

<div class=" row">

[Luigi Martulli]

Thanks, how can I add that row class? Sorry I've no idea :S

Should be in each template right?

[Minesh]

Well - it should be within view's "loop editor" section and if you are using the content template within the "loop" - then you can see it within that assigned content template.

If you do not able to locate it, send me access details so I will check and add it there on your behalf.

I have set the next reply to private which means only you and I have access to it.