Scroll inside the previewer

Hello,

I have a question about the outsystems previewer. What i mean by that is shown in screenshot1.png.

The images shows an arrow, that arrow points to a scrollbar. My question is is there a way for me to scroll that scrollbar?


The only way i got it to scroll was by removing the css class "overflow-y: auto;" But i need that there on the page


Kind regards

Jeroen

screenshot1.png

Solution
.main-content {
    overflow-y: auto;
-->    -servicestudio-overflow-y: visible;
    max-height: calc(100vh - 124px);
-->    -servicestudio-max-height: none;
    margin-top: 60px;
}

Found it. Thanks to @NUNO RODRIGUES 

The above example shows what i did. You override the css with the -servicestudio- tag.

The tag has to be underneath the default value, else the non servicestudio value is taken


Read this

Hi Jeroen,

Have you tried to move that curser by clicking on that scroll bar and drag it to down by moues lift click, I have tried and it is moving but when i do it with mouse without clicking it is not working,

Regards,

Komal

Thanks for the fast response.

That doesn't seem to work. I can't click that scrollbar. 

Just to be clear. This is not the scrollbar u normaly have. This is because i have a css class with a fixed heigth and overflow-y: auto;

Hello Jeroen,

You can use the in your theme this:

-servicestudio-<css property>: <value>;

In your case:

-servicestudio-overflow-y: auto

And this will be applied when you are on the Service Studio.

Hope it helps,

Nuno R



Hello,

Is this what u meant?:

.main-content {
    overflow-y: auto;
    -servicestudio-overflow-y: auto;
    max-height: calc(100vh - 124px);
    margin-top: 60px;
}

Because this is not working. It does remove the scrollbar. But i still can't scroll. Should i also override the max-heigth ?


Solution
.main-content {
    overflow-y: auto;
-->    -servicestudio-overflow-y: visible;
    max-height: calc(100vh - 124px);
-->    -servicestudio-max-height: none;
    margin-top: 60px;
}

Found it. Thanks to @NUNO RODRIGUES 

The above example shows what i did. You override the css with the -servicestudio- tag.

The tag has to be underneath the default value, else the non servicestudio value is taken


Read this

Hello Jeroen,

The solution that I give you fix the issue :).

I just forgot to told you that is necessary to put "underneath" because for me normally when I need to override somethig I always know to do that.

Best regards,

Nuno R

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.