Page 2 of 2

Re: if use two module filter, one don't collapse

Posted: 07 Jun 2021, 09:16
by ehndrju
I wanted to do just that.
I thought it was two modules.
I don't understand how to move a module from one position to another :(
I don't have enough brains :(
Can you share the code? is it css?

Re: if use two module filter, one don't collapse

Posted: 07 Jun 2021, 17:02
by Jan
Hi, it is all done in template.

The left block is a "position-7" which is normally displayed on desktop but when the screen is smaller, then specific CSS rule is used:

Code: Select all

@media only screen and (max-width: 767px)
#slide-navbar-collapse {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 80%;
    height: 100%;
    background-color: #ccd6df;
    overflow: auto;
}
it works together with Bootstrap rules:

So when there is standard desktop, the columns are set to:

col-md-3
col-md-9

when there is mobile, then:

col-sm-12
col-sm-12

Code: Select all

<div class="col-sm-12 col-md-3 col-lg-3 col-xl-3 pt-menu collapse navbar-collapse" id="slide-navbar-collapse" style="display: block;">
And when col-sm-12 is active, the id="slide-navbar-collapse" changes the standard block to collapsed menu

All this can be seen in the source code of the https://www.phoca.cz/jtd/

Jan

Re: if use two module filter, one don't collapse

Posted: 08 Jun 2021, 06:06
by ehndrju
I see differences in the structure of my template (Phoca Pix) and yours (JTD)
Please look, is this critical?
I can do it in my template as in JTD?
Image

Re: if use two module filter, one don't collapse

Posted: 08 Jun 2021, 19:03
by Jan
Hi, both are different templates, one is gantry5 template the second is just simple template.