How to make the button float on the screen when scrolling

how to make the button float on the screen when scrolling

In the Button → General → Design Show as → the floating A round icon

Is there a way for a long button to float on the screen?

Currently no.
You can do something with CSS, but it is applied to all buttons in the detail screen because it is not very easy to select one or more specific buttons.
What do you need? Do you need a modal window? In this case, there is something already done by others that maybe you can use.

1 Like

Thanks! i just need 1 floating button on the screen when scrolling

Now I’ll take a look, in the meantime if you want to explore these possibilities of doing things with CSS, I recommend this repository:

Most of the contributions here are by @ThinhDinh and @Lucas_Pires

1 Like

Put a Rich Text component in your detail screen and inside that component enter this code:

<pre><span><style>
[data-test="app-button-view"] { 
position: fixed;
margin-left:0px;
left: 50%;
bottom: 10%; 
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width:60%;
z-index: 10;
}
</style></span></pre>

If you need a different positioning just change the “bottom” parameter.
Could this be right for you? Remember that it acts on all buttons!

3 Likes

Thanks!

1 Like

I am very happy to have your help

1 Like

You’re welcome.

This is a very generous community, you will see that you will also get help from others when there is a problem. We are very proud and excited about this development platform.
Please assign “solution” to my previous suggestion if you think it met your needs.
Hi, good job :slightly_smiling_face:

4 Likes