fix mobile devices

esphome · Jul 15, 2024 · 6e16926 · 6e16926
1 parent 14b1327
commit 6e16926
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 3 deletions.
diff --git a/packages/v3/src/css/esp-entity-table.ts b/packages/v3/src/css/esp-entity-table.ts
@@ -78,7 +78,8 @@ export default css`
   }
   .climate-row {
     width: 100%;
-    display: flex;
+    display: inline-flex;
+    flex-wrap: wrap;
     text-align: left;
   }
   .climate-row > select{
@@ -88,6 +89,7 @@ export default css`
     align-content: center;
     width: 150px;
   }
+    
   input[type="color"]::-webkit-color-swatch-wrapper {
     padding: 0 !important;
   }

diff --git a/packages/v3/src/esp-entity-table.ts b/packages/v3/src/esp-entity-table.ts
@@ -618,7 +618,9 @@ class ActionRenderer {
   render_climate() {
     if (!this.entity) return;
     let target_temp_slider, target_temp_label, target_temp;
-    let current_temp = html`<div class="climate-row"><label>Current:&nbsp;${this.entity.current_temperature} °C</label></div>`;
+    let current_temp = html`<div class="climate-row" style="padding-bottom: 10px";>
+                              <label>Current:&nbsp;${this.entity.current_temperature} °C</label>
+                            </div>`;
 
     if (
       this.entity.target_temperature_low !== undefined &&

diff --git a/packages/v3/src/esp-range-slider.ts b/packages/v3/src/esp-range-slider.ts
@@ -186,7 +186,8 @@ export class EspRangeSlider extends LitElement {
       cssReset,
       css`
         :host {
-          width: 100%;
+          min-width: 150px;
+          flex: 1;
         }
         input[type=range] {
           -webkit-appearance: none;