Merge pull request #4 from davet2001/issue3-prevent-consumer-wrapping3

Adjust wrapping rules to prevent more than 2 line consumers
davet2001 · Oct 27, 2024 · 8acdc2a · 8acdc2a
2 parents 91f621e + 0ac4b85
commit 8acdc2a
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 16 deletions.
diff --git a/src/elec-sankey.ts b/src/elec-sankey.ts
@@ -1174,6 +1174,9 @@ export class ElecSankey extends LitElement {
       flex-shrink: 0;
       justify-content: left;
       padding-left: 6px;
+      white-space: pre;
+      overflow: hidden;
+      text-overflow: ellipsis;
     }
     svg {
       rect {

diff --git a/src/ha-elec-sankey.ts b/src/ha-elec-sankey.ts
@@ -44,31 +44,26 @@ export class HaElecSankey extends ElecSankey {
         class=${id ? "label label-action-clickable" : "label"}
         id=${_id}
         @click=${id ? this._handleMoreInfo : nothing}
-      >
-        ${_name || nothing}
-        ${icon
-          ? html`<ha-svg-icon id=${_id} .path=${icon}> </ha-svg-icon><br />`
-          : nothing}
-        ${valueB !== undefined
-          ? html` <span class="return" id=${_id}>
+      >${_name || nothing} ${icon
+        ? html`<ha-svg-icon id=${_id} .path=${icon}> </ha-svg-icon>`
+        : nothing}${valueB !== undefined
+          ? html`<br /><span class="return" id=${_id}>
                 <ha-svg-icon id=${_id} class="small" .path=${mdiArrowLeft}>
                 </ha-svg-icon
                 >${formatNumber(valueB, this.hass.locale, {
-                  maximumFractionDigits: 1,
-                })}&nbsp;${this.unit}</span
+            maximumFractionDigits: 0,
+          })}&nbsp;${this.unit}</span
               ><br />
               <span class="consumption" id=${_id}>
                 <ha-svg-icon id=${_id} class="small" .path=${mdiArrowRight}>
                 </ha-svg-icon
                 >${formatNumber(valueA, this.hass.locale, {
-                  maximumFractionDigits: 1,
-                })}&nbsp;${this.unit}
+            maximumFractionDigits: 0,
+          })}&nbsp;${this.unit}
               </span>`
-          : html`${formatNumber(valueA, this.hass.locale, {
-              maximumFractionDigits: 1,
-            })}&nbsp;${this.unit}`}
-      </div>
-    `;
+          : html`<br />${formatNumber(valueA, this.hass.locale, {
+            maximumFractionDigits: 0,
+          })}&nbsp;${this.unit}`}</div>`;
   }
 
   private _handleMoreInfo(e: MouseEvent) {