Hi Jeff
Any idea how to make this working perfectly from Tablet/Browser as well?
it is quite annoying to see that from the mobile view looks pretty nice and in the tablet looks horrible 
thanks if any help you can give me.
How does it look like on tablet for you?
The problem is that loose the alignment
This accordingly with the browser dimensions
That’s surely my limitations about css knowledge, maybe there’s is a way to fix it in a center position.
the 1st browser is firefox 
the second is chromium
in the pure Tablet layout is not much different
see the screenshot
Try this code to see if it works for you.
6 Likes
thank you so much!
and this is the applied code (if anyone may need it):
<!-- Blurry -->
<a style="top:200px;">
<div style="
position:fixed;
top:0px;
left:-5%;
margin: 0%;
padding: 100%;
background-color: rgb(0 0 0 / 50%);
backdrop-filter: blur(4px);">
</style></div></a>
<!-- Box -->
<div style =" position: fixed;
top: 280px;
width: 94%;
max-width:680px;
opacity: 1;
margin-left: -5px;
height:210px;
background: white;
border-radius: 10px;
padding-top: 1%;
padding-left: 7%;
padding-right: 7%;
box-shadow: rgb(0 0 0 / 15%) 0px 4px 10px;
text-align: center;
z-index:0 !important;"
>
<!-- Text-->
<br>
<h2><font color=#000>メールを追加</h2>
Follow us!
<pre><span><style>
[data-test="app-button-view"] {
position: fixed;
top: 438px;
margin-left: calc(5% - 10px);
width: 40%;
max-width: 200px;
}
[data-test="app-text-field"] {
position: fixed;
top: 380px;margin-left: calc(8% - 10px);
width: 100%;
max-width: 400px;
}
.fab-target >* {
display:none;
}
</style></span></pre>
4 Likes
6 Likes
I added a conditional action to the right button in the button bar and this happened:
Any idea?
Your button went rogue or didn’t catch the flight-box? 
Sorry, fun reflex!
Good luck with that, Robert.
<silently exiting🚪>
1 Like
It’s somehow tied to the compose SMS action. Weeeeird.
Add this to your code.
a[rel="noopener noreferrer"] {
position: fixed;
top: 420px;
margin-left: calc(5% - 10px);
width: 40%;
max-width: 250px;
}
At the point of adding a SMS action, the button becomes … unattached to the bar as it now follows an a href setup, hence this addition.
4 Likes
I dunno how you found that…thanks!
4 Likes
How do you get the two button yes or no?
I’m just using a button bar component, I believe.
Tried that.
I connected the left to creating new row for my order.and right to the show profile screen.the right one worked correctly but the left got stuck even action were given.why?
I don’t know why. I don’t know what you are trying to, what actions you are calling, or what you expect to happen, so I don’t know why it’s doing what is doing. You’re going to have to explain in more detail and explain what you mean by “stuck”. Include any screenshots if you can.
3 Likes
Hello, this is on my builder
this is on dekstop (fullscreen)
This is on dekstop (not fullscreen) -
How to make it nicer on all conditions (phone, dekstop (fullscreen & non fullscreen) and tablet )?
I want to add a field " number Entry" on popup
<!-- Blurry -->
<a style="top:200px;">
<div style="
position:fixed;
top:0px;
left:-5%;
margin: 0%;
padding: 100%;
background-color: rgb(0 0 0 / 70%);
backdrop-filter: blur(4px);">
</style></div></a>
<!-- Box -->
<div style =" position: fixed;
top: 300px;
width: 94%;
max-width:680px;
opacity: 1;
margin-left: -5px;
height:180px;
background: white;
border-radius: 10px;
padding-top: 1%;
padding-left: 7%;
padding-right: 7%;
box-shadow: rgb(0 0 0 / 15%) 0px 4px 10px;
text-align: center;
z-index:0 !important;"
>
<!-- Text-->
<br>
<h3><font color=#000>Enter Amount</h3>
I want to add a field " number Entry" here
<pre><span><style>
[data-test="app-button-view"] {
position: fixed;
top: 420px;
margin-left: calc(5% - 10px);
width: 40%;
max-width: 250px;
z-index: 99;
}
.fab-target >* {
display:none;
}
</style></span></pre>
How do I adapt the code to make the gray background that ends up hiding the app’s screen transparent and work as a popup?
How can I put an image to background of modal/popup?
I still cannot find the solution. hmm
Phone size :
Dekstop size :
And this is my coding :
<!-- Blurry -->
<a style="top:200px;">
<div style="
position:fixed;
top:0px;
left:-5%;
margin: 0%;
padding: 100%;
background-color: rgb(0 0 0 / 50%);
backdrop-filter: blur(4px);">
</style></div></a>
<!-- Box -->
<div style =" position: fixed;
top: 280px;
width: 94%;
max-width:680px;
opacity: 1;
margin-left: -5px;
height:210px;
background: white;
border-radius: 10px;
padding-top: 1%;
padding-left: 7%;
padding-right: 7%;
box-shadow: rgb(0 0 0 / 15%) 0px 4px 10px;
text-align: center;
z-index:0 !important;"
>
<!-- Text-->
<br><br>
<h3><font color=#000>Notice</h3>
Are you sure to regenerate report ?
<pre><span><style>
[data-test="app-button-view"] {
position: fixed;
top: 420px;
margin-left: calc(5% - 10px);
width: 40%;
max-width: 200px;
}
[data-test="app-text-field"] {
position: fixed;
top: 380px;margin-left: calc(8% - 10px);
width: 100%;
max-width: 400px;
}
.fab-target >* {
display:none;
}
</style></span></pre>