How to change the minimum screen width for tablet devices?

SupportHow to change the minimum screen width for tablet devices?
AvatarLesia Venzyk asked 1 year ago

SP Page Builder allows you to hide page elements (row, column, addons) on different types of devices (dektop, tablet, smartphone).
on line 27 of the file /templates/lt_comuser/less/variables.less
there are such entries:
// Extra small screen / phone
//** Deprecated `@screen-xs` as of v3.0.1
@screen-xs: 480px;
//** Deprecated `@screen-xs-min` as of v3.2.0
@screen-xs-min: @screen-xs;
//** Deprecated `@screen-phone` as of v3.0.1
@screen-phone: @screen-xs-min;
// Small screen / tablet
//** Deprecated `@screen-sm` as of v3.0.1
@screen-sm: 768px;
@screen-sm-min: @screen-sm;
//** Deprecated `@screen-tablet` as of v3.0.1
@screen-tablet: @screen-sm-min;
// Medium screen / desktop
//** Deprecated `@screen-md` as of v3.0.1
@screen-md: 992px;
@screen-md-min: @screen-md;
//** Deprecated `@screen-desktop` as of v3.0.1
@screen-desktop: @screen-md-min;
// Large screen / wide desktop
//** Deprecated `@screen-lg` as of v3.0.1
@screen-lg: 1200px;
@screen-lg-min: @screen-lg;
//** Deprecated `@screen-lg-desktop` as of v3.0.1
@screen-lg-desktop: @screen-lg-min;
As I understand it, devices with a screen width of more than 768 pixels and less than 992 pixels are considered tablets according to the terms of the template.
Tell me please what needs to be changed so that the template perceives devices with a screen width of more than 640 pixels and less than 992 pixels as a tablet.
It is exclusively about displaying and hiding page elements on devices with 640px screen width.
Simply replacing line
@screen-sm: 768px;
with line
@screen-sm: 640px;
does not produce the desired result.
Thanks in advance.

1 Answers
KelvinKelvin Staff answered 1 year ago

Hi,
On SP Page Builder, each Block, you will see icon “Eye”, this icon allow you disable section temporary (un-display), so you can use it than Responsive options. See my screenshot https://take.ms/1HW8j

AvatarLesia Venzyk replied 1 year ago

I understand it.

Where is the minimum screen width for tablet devices?
Well, for example: for devices with a screen width less than 640px, the row background should be red,
for screens 640-992px – yellow,
for screens with a width of more than 992 px – green.

It will be three rows. First is displayed only on smartphones, the second – only on tablets, the third – only on desktops.

The question is, where can I change the range of screen widths for devices like a tablet from 768-992px to 640-992px?

Thank in advance.

AvatarLesia Venzyk replied 1 year ago

Help me, please.

AvatarLesia Venzyk replied 1 year ago

Thank’s. We alredy resolve it.

50% OFF FOR XMAS & NEW YEAR!

Access Life-time All-In-One Membership with all 500+ Premium WordPress themes and Joomla templates and new theme(s) every month just $199.50 (instead of $399). Life-time PRO theme access, download and support, no renewal in the future.

Get DEV plan of All-In-One Now!

Merry xMas & Happy New Year! Get 50% OFF for your purchase! Coupon code: XMASNEWYEAR50 More Details
Happy New Year 2021! Get 50% OFF for your purchase! Coupon code: XMASNEWYEAR50 More Details