Hi, I am trying to replicate a design I found and I got stuck on a small portion. Look at the example below:
This is part of a right column in the total design.
How should I structure this in a way that Preview and Download button are next to each other and equally stretched with margins below the Send Invoice, but when screen is smaller than for example 768px Preview and Download are stacked and equal to the size of the Send invoice button.
Current setup:
1 - Main Button group (Column Layout)
1.1 - Send Invoice Button
1.2 - Sub Button Group (Row Layout)
1.2.1 - Preview Button
1.2.2 - Download Button
Problem: On smaller screens Preview and Download button will not stack on top of each other
Thanks, Just after hitting Send I noticed the alow gap options and I got the same result as in your example. I will know build out my the design. Future questions will be added here when applicable.
A side question: Is it anno 2022 stil not possible to simple add an icon to a button? Now I need to create a button using a grouped Icon and Text element.
Another question. How should I approach the following using the responsiveness engine. I want to have a sort of floating button, that is positioned “above” the main group. Examples for inspiration:
