Hello, been messing around a lot trying to get something like this nice input with text on borders:
It kind of works to put a text above input with negative margins, but some strange bugs start to appear when the input field stretches, maybe someone knows of a fairly simple way to make this?
You can use creative re-useable element styling to achieve it. Create reusable element ‘smart input’. I’ve done it before but can’t remember exactly how so you may want to use these instructions to push you in the right direction rather than copying them word for word…
There is obviously an input in the middle. The input is in a Group container. The group container has a border colour when input is focused (using conditional formatting).
The text is the fiddly part - I can’t remember if I used align to parent or fixed but you can create the text element (make sure it has a white background) and play around with it so it stays in the right spot. The text element should be on top of the group container, so the element tree is
Reusable element
/ Text
/ Group
/ / Input Container