I placed the buttons below instead of putting them on the right. This prevents them from being crushed or cut off when the window width is reduced (on mobile).
On the right, a > button (identical to the lamp) that allows you to open the pop-up for adjustment (shutter with the features State + position).
and instead of putting the texts « open » « stop » « close », just keep the 3 symbols by enlarging them
which would save space in the height of the widget?
After my idea of putting the name on the left and the action on the right, it doesn’t leave much space. You can see that at my place, the name doesn’t fit.
ben si: the position line of the shutter is no longer there since a pop-up replaces it
or else I haven’t understood from the beginning what you wanted to do!
But my suggestion was to remove the text « open, close, stop », to use thicker arrows, to put the name on 2 lines, to put the % below, and to put the logo for the popup, so as to match the lights. Which would give this:
I find that it takes up less space and is a bit less heavy than your initial proposal:
I’m insisting again to say that what you’re proposing already exists, for controls without text. If you reduce the size even more, the text disappears and only the arrows remain.
On my mobile size, I only have the icons without the text.
After that, the goal here is to add the popup, in the same spirit as the lights. So on the far right, there is the > button that allows you to access the popup.
So either we put the quick controls as I put them below, or we put nothing to avoid cluttering and increasing the height.
I’m starting from the principle of not putting anything (or an open or closed percentage) except the arrow with your popup that you presented
Why add open or closed since 40% doesn’t tell me if it’s 40% closed or 40% open
?
