UI-Lovelace-Minimalist
Move away from using px and instead use vw for styling
Have you considered using vw instead of px (for font sizes, padding, etc) in the button card template (and theme file)? It would make the it a lot more responsive and would allow you to use one theme file for desktop, tablet and mobile. I am working on a layout that works on my desktop and kiosk tablet and am running into issues related to sizing. The stumbling block is the reliance on px instead of vw. Is that something you're considering? I didn't want to have to modify the button card template for my situation, if I can avoid it.
You can also use vmin and vmax for fonts if you want to limit the smallest and largest sizes. Just a thought.
Yes, good idea.
Can you contribute to this? I'm happy to help you integrate the changes if you have any questions but my knowledge on vw and px is fairly limited.
@mlittle408 If you haven't implemented something on your end yet I'd suggest to work with variables to have some proper framework in place instead of just converting everything to responsive units. That way new cards are properly done out of the box.
To keep it simple, I would suggest the following variables, any thoughts?
space-xs: "0.5em" space-s: "1.0em" space-m: "1.5em" space-l: "2.0em" space-xl: "2.5em"
Maybe this issue can be addressed together with @sildehoop 's suggestion to make our internal templates more modular to be able to use them more versatile? https://github.com/UI-Lovelace-Minimalist/UI/discussions/105
This just came to my mind... But one thing at a time. We move slowly and steadily ;-) Merry Christmas to all of you
A combo of variables and predefined classes would be the most versatile option if someone knows a way to apply classes to specific cards with card-mod. Haven't looked that much into it yet.
Merry Christmas and happy holidays btw! 😄
I thought about something like this to design the cards and think about the margins and sizes
