Hello!
I'm having trouble in reactive application. Is there anyway to disable the layout of tablet/mobile and only have the layout of desktop?
Also, when you split screens, is there anyway to make the content 100% and open a horizontal scroll bar to see all the page?
Hi Madalena,
You can use Adaptive/DisplayOnDevice widget to display the content only on desktop
This widget will give you 3 content as mentioned in the above screenshot. Put all the code to be displayed on the desktop into OnDesktop placeholder. Then the content will be visible only on desktop and not in Tablet or Mobile.
Cheers!!
Thanks,Aadhavan S
Thanks for the answer Aadhavan!
The problem here is that i'm using a theme that when the resolution is going small, the theme turns into tablet or mobile. And i don't what to have that behavior... But i have to use that theme. So i need to find a solution to disable that.
Hi @Madalena Nascimento
Outsystems Compiles the screens with Meta tag in Head elementAnd it is having following by default
<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1">
We need to change the meta tag content to viewport-fit=cover, width=1280px, initial-scale=1
Use the following Javascript on OnReady of the screen to Update the Meta tag
document.querySelector('meta[name="viewport"]').setAttribute("content", "viewport-fit=cover, width=1280px, initial-scale=1");
This will make a horizontal scroll in tablet and mobile view
Otherwise Use the following css to achieve that
body {
width: 1280px;
overflow-x: auto;
height: 100%;
}
Thanks & Regards,
Janakiraman JR.
Hi @Madalena Nascimento We can follow 2 different way to solve this problem.
1. Disable tablet and mobile Layout
Using this CSS theme will disappear in mobile and tablet and only show only in Desktop view.
@media(max-width: 1199px){ body{ display: none; } }
2. With horizontal scroll
If you want to show scroll on mobile and tablet view
@media(max-width: 1199px){
body{ max-width: 1199px; margin: auto; overflow-x: scroll; width: 100%; }
Thanks,
Ankit Maharshi