Lesia Venzyk asked 2 years 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.
Kelvin Staff answered 2 years 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
Lesia Venzyk
replied 2 years 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.
Lesia Venzyk
replied 2 years ago Help me, please.
Lesia Venzyk
replied 2 years ago Thank’s. We alredy resolve it.
