slipx06 / sunsynk-power-flow-card

⚡A customizable Home Assistant card to emulate the Sunsynk System flow that's displayed on the Inverter screen.
MIT License
161 stars 48 forks source link

Panel Mode does not scale correctly when width>height #396

Closed derolli1976 closed 2 months ago

derolli1976 commented 2 months ago

Is there an existing issue for this?

Current Behavior

If you use the "panel mode" switch in general options and embed the card into a "1-Card" dashboard, it seems to scale to 100% width rather than 100% height what causes to card to overlap at the bottom and is showing scrollbars. This is the case for any browser in landscape mode. Expection: Card scales in a way that no scrollbars are present. 2024-04-22 10 43 12 2024-04-22 10 43 48

Steps To Reproduce

  1. Desktop Browser or landscape tablet
  2. Create new HASS dashboard and choose "Panel (1 Card"
  3. Add the power flow card to this dashboard and set it to "panel mode"
  4. Scale the browser window so the width > height.

Expected behaviour

Scale so no scrolling is nescessary

Card Version

4.32.0

Home Assistant Version

2024.4.3

Configuration

No response

Relevant log output

No response

slipx06 commented 2 months ago

Hi. Yes there are some nuances with scaling and the combination of panel mode. There is the start of a discussion here

For more flexibility have a look at using grid-layout, but what you describe is common behavior for all ha cards

grid-template-columns: 10% 80% 10%
grid-template-areas: |
  ". pf ."
justify-items: stretch