From 24cf8c0f157a6224f6718bef3b4f6065870ae7ca Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Wed, 15 Jun 2022 15:35:34 +0300
Subject: [PATCH] Fixing Remove Cluster dialog sizing

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 .../delete-cluster-dialog/view.module.scss    | 20 +++++++++++++------
 .../components/delete-cluster-dialog/view.tsx |  2 +-
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/renderer/components/delete-cluster-dialog/view.module.scss b/src/renderer/components/delete-cluster-dialog/view.module.scss
index 0c95c3d2a6..e8f513a991 100644
--- a/src/renderer/components/delete-cluster-dialog/view.module.scss
+++ b/src/renderer/components/delete-cluster-dialog/view.module.scss
@@ -1,17 +1,22 @@
 .warning {
-  @apply mt-4 flex py-4 px-6 rounded-md items-center;
+  display: flex;
+  margin-top: var(--margin);
+  padding: calc(var(--padding) * 2) calc(var(--padding) * 3);
+  border-radius: 4px;
+  align-items: center;
   background: #fad8d7;
   color: #797979;
 }
 
 .warningIcon {
-  @apply mr-5;
+  margin-right: calc(var(--margin) * 2.4);
   font-size: 26px;
 }
 
 .dialog {
   > div {
-    @apply rounded-md bg-white;
+    border-radius: 4px;
+    background-color: white;
     max-width: 600px;
     min-width: calc(45 * var(--unit));
   }
@@ -22,11 +27,14 @@
 }
 
 .dialogContent {
-  @apply p-9 leading-9;
+  padding: calc(var(--padding) * 2) calc(var(--padding) * 3);
 }
 
 .dialogButtons {
-  @apply flex justify-end p-7 rounded-md;
+  display: flex;
+  border-radius: 4px;
+  justify-content: flex-end;
+  padding: calc(var(--padding) * 2);
   background: #f4f4f4;
 
   > * {
@@ -35,7 +43,7 @@
 }
 
 .hr {
-  @apply mt-7;
+  margin-top: calc(var(--margin) * 3);
   height: 1px;
   background: #dfdfdf80;
 }
\ No newline at end of file
diff --git a/src/renderer/components/delete-cluster-dialog/view.tsx b/src/renderer/components/delete-cluster-dialog/view.tsx
index 79e0ea88ee..3d86bae4a9 100644
--- a/src/renderer/components/delete-cluster-dialog/view.tsx
+++ b/src/renderer/components/delete-cluster-dialog/view.tsx
@@ -204,9 +204,9 @@ class NonInjectedDeleteClusterDialog extends React.Component<Dependencies> {
         <div className={styles.dialogContent}>
           {this.renderDeleteMessage(state)}
           {this.renderWarning(state)}
-          <hr className={styles.hr} />
           {contexts.length > 0 && (
             <>
+              <hr className={styles.hr} />
               <div className="mt-4">
                 <Checkbox
                   data-testid="context-switch"