search

flixlix / power-flow-card-plus

A power distribution card inspired by the official Energy Distribution card for Home Assistant
501 stars 59 forks source link

Full-size scaling is not suitable for all screen sizes #605

Open Abb4d0n opened 2 months ago

Abb4d0n commented 2 months ago

Hi,

when using the "full-size" option, static scaling and translate values are used: https://github.com/flixlix/power-flow-card-plus/blob/31a95183699cfd456f84ccf0849e97ac57364612/src/style.ts#L67 However, this is not suitable for all screen sizes.

Would it be possible to calculate a scale factor depending on the size of the ha-card tag and the content div? Maybe something like this:

var hacard = document.getElementsByTagName("ha-card")[0];
var content = document.getElementById("power-flow-card-plus");
var scalefactor = Math.min(hacard.offsetHeight/ content.offsetHeight, hacard.offsetWidth / content.offsetWidth)
content.style.transform = "scale("+scalefactor+")";

Thanks