From 99862cade9f0e80247d9419a3f8a7f83fc6d2362 Mon Sep 17 00:00:00 2001
From: Michael <85116490+MishaZhem@users.noreply.github.com>
Date: Fri, 2 Aug 2024 13:33:44 +0300
Subject: [PATCH] feat: fixes iot dashboard (#78)

* chore: change height for lighting

* fix: fix height for tablets
---
 .../Lighting/lighting.component.html          |  2 +-
 .../Lighting/lighting.component.less          |  6 +++
 .../control-panel.component.html              | 39 +++++++++----------
 .../control-panel.component.less              |  5 ++-
 4 files changed, 30 insertions(+), 22 deletions(-)

diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.html
index c160de0ad..4c100131e 100644
--- a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.html
+++ b/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.html
@@ -21,7 +21,7 @@
             tuiBlock
             [ngClass]="{checked: control!.value}"
         >
-            <div>
+            <div class="title-room">
                 <input
                     tuiCheckbox
                     type="checkbox"
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.less b/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.less
index d0679b95b..f6b13372f 100644
--- a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.less
+++ b/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.less
@@ -14,6 +14,12 @@
     margin-left: auto;
 }
 
+.title-room {
+    display: flex;
+    height: 1.875rem;
+    align-items: center;
+}
+
 .checked {
     background-color: var(--tui-status-warning-pale);
 }
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.html
index f37815d11..6e82eb60d 100644
--- a/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.html
+++ b/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.html
@@ -1,21 +1,20 @@
-<div *ngFor="let i of controlPanelService; let ind = index">
-    <button
-        tuiCardLarge
-        tuiHeader
-        tuiSurface="elevated"
-        class="button-card"
-    >
-        <aside tuiAccessories>
-            <tui-avatar
-                appearance=""
-                size="l"
-                [src]="i.img"
-                [style.color]="'var(--tui-background-accent-opposite)'"
-            />
-        </aside>
+<button
+    *ngFor="let i of controlPanelService; let ind = index"
+    tuiCardLarge
+    tuiHeader
+    tuiSurface="elevated"
+    class="button-card"
+>
+    <aside tuiAccessories>
+        <tui-avatar
+            appearance=""
+            size="l"
+            [src]="i.img"
+            [style.color]="'var(--tui-background-accent-opposite)'"
+        />
+    </aside>
 
-        <h3 class="text">
-            {{ i.name }}
-        </h3>
-    </button>
-</div>
+    <h3 class="text">
+        {{ i.name }}
+    </h3>
+</button>
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.less b/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.less
index c8ec7f4e9..038428df8 100644
--- a/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.less
+++ b/apps/taiga-lumbermill/src/dashboards/iot/components/control-panel/control-panel.component.less
@@ -23,12 +23,15 @@
 }
 
 .button-card {
+    display: flex;
     max-width: max-content;
+    align-items: center;
     padding-right: 1.75rem;
     gap: 1rem;
 
     @media (max-width: 50rem) {
         width: 100%;
+        height: 100%;
         max-width: 100%;
     }
 
@@ -39,7 +42,7 @@
     }
 }
 
-div:last-child {
+.button-card:last-child {
     grid-column-end: 3;
     grid-column-start: 1;
 }