Joomla Templates Club 406,261 posts

[BigHug Friend BigHugJoin date: September 2012Posts: 60Downloads:17Uploads:277 Thanked: 11 times in 1 posts]

#763940

Hi,

how do I change the responsive layout of the default template for ‘medium’ to be the same as for ‘large’?

thanks!

[saswiss Friend saswissJoin date: August 2013Posts: 144Downloads:149Uploads:43 Thanks: 7 Thanked: 2 times in 2 posts]

#766243

Hi again,
the alternative is, how to set/change the parameters for large/medium in the backend – on my PC (large) the homepage is shown properly, but when I open the site on my laptop, (medium) it looks different?

Thanks!

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#780786

Hi,

I am afraid you will not able to change the setting that from back-end of your site but you will find and see the parameter to set it from templates/ja_mono/less/variables.less

// Extra small screen / phone
// Note: Deprecated @screen-xs and @screen-phone as of v3.0.1
@screen-xs:                  480px;
@screen-xs-min:              @screen-xs;
@screen-phone:               @screen-xs-min;

// Small screen / tablet
// Note: Deprecated @screen-sm and @screen-tablet as of v3.0.1
@screen-sm:                  768px;
@screen-sm-min:              @screen-sm;
@screen-tablet:              @screen-sm-min;

// Medium screen / desktop
// Note: Deprecated @screen-md and @screen-desktop as of v3.0.1
@screen-md:                  992px;
@screen-md-min:              @screen-md;
@screen-desktop:             @screen-md-min;

// Large screen / wide desktop
// Note: Deprecated @screen-lg and @screen-lg-desktop as of v3.0.1
@screen-lg:                  1200px;
@screen-lg-min:              @screen-lg;
@screen-lg-desktop:          @screen-lg-min;

@screen-hd:                  1400px;
@screen-hd-min:              @screen-hd;
@screen-hd-desktop:          @screen-hd-min;

// So media queries don't overlap when required, provide a maximum
@screen-xs-max:              (@screen-sm-min - 1);
@screen-sm-max:              (@screen-md-min - 1);
@screen-md-max:              (@screen-lg-min - 1);
@screen-lg-max:                    (@screen-hd-min - 1);

and change my highlight text above.

Once done, you can go to back-end of template manager and click compile Less to CSS button

Regards

1 user says Thank You to Ninja Lead for this useful post

1. gjc1

[saswiss Friend saswissJoin date: August 2013Posts: 144Downloads:149Uploads:43 Thanks: 7 Thanked: 2 times in 2 posts]

#784533

Hi Ninja,
thanks a lot! worked like a dream…just had to change the padding in the style.css too 😉

[Author]

Posts