Shape 5

Joomla Club Extensions => Horizontal Accordion v2 - Club => : sidearm23 January 28, 2015, 08:32:46 AM



: Horizontal Accordion Menu On Small Screen
: sidearm23 January 28, 2015, 08:32:46 AM
Hi,
  I have the horizontal menu on my site and it look great on a computer and tablet, but on my phone in portrait it goes to one column which works fine.   However, in landscape on my phone it looks cut off and smashed together because it is trying to display all 4 sections.  I can't seem to find the setting that let's the s5_ha_# sections be altered so that they show up in one column or two columns etc.  I assume there is such a setting because in your demo a landscape phone shows up with one larger section in one column.  Any assistance would be great.

Also having a slightly similar issue with the section underneath with the circle callouts...i have 5 of those sections, and when the are resized to fit a smaller screen they show up a 2, 1, 2 but the 1 is on the right hand side...so it just looks a bit odd.  Any way to change that easily?


: Re: Horizontal Accordion Menu On Small Screen
: mikenicoll January 28, 2015, 10:03:33 PM
Hello,

Please post a URL where this occurs


: Re: Horizontal Accordion Menu On Small Screen
: sidearm23 January 29, 2015, 04:33:02 PM
runcobrothers.com ....i took out one of the blocks and it looks better..but i would prefer to have 5 and have them resize on a landscape phone setup....thanks


: Re: Horizontal Accordion Menu On Small Screen
: jonahh January 30, 2015, 01:54:12 PM
You can add some CSS to the s5_responsive.css file so that the font size is decreased at the resolution the text bumps down so as to allow it not to bump down before all the other 3 module areas.


: Re: Horizontal Accordion Menu On Small Screen
: sidearm23 January 30, 2015, 02:09:36 PM
Ok i could try that...how would i get landscape to look like it does in portrait on a phone...having just one block on top of each other....on you demo of zoka if you go to the landscape phone view it shows a rectangle shaped box on top of another and so on...that is what my goal would be...
Thanks again


: Re: Horizontal Accordion Menu On Small Screen
: mikenicoll January 31, 2015, 12:13:40 AM
Hello,

In the Template Manager under Layout you can adjust the Responsive Settings for the Top_Row1 where this module is published. You would want to set it to go to a single column at a higher resolutions meaning they will stack sooner. They will always appear wider when landscape as the modules scale responsively but this will cause the entire row to stack at any resolutions necessary.


: Re: Horizontal Accordion Menu On Small Screen
: sidearm23 February 10, 2015, 12:30:19 PM
Unfortunately the layout section does not seem to cause a response....i changes TOP ROW1 to single column at 1100px and no difference, tried several other and see no change.  It is published to that section so I don't understand why it is not making a difference.  When I change other sections it seems to work fine.


: Re: Horizontal Accordion Menu On Small Screen
: jonahh February 11, 2015, 08:38:29 PM
Hello,

To change when the module collapses all the sections into one single column you would need to edit the CSS here:

modules\mod_s5_horizontal_accordion\css\s5_horizontal_accordion2.css

Notice:


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

.horzaccordion {
height:auto !important;}

.horzaccordion li {
float: none !important;
width: 100% !important;}

}

This is what sets when the columns collapse into one.