From f5e5baf5f2d6d069e27a7b9ab9483cec8d43f2f6 Mon Sep 17 00:00:00 2001
From: "Hung-Han (Henry) Chen" <1474479+chenhunghan@users.noreply.github.com>
Date: Tue, 3 Nov 2020 18:17:23 +0800
Subject: [PATCH] Add flex align-center to slider-container and remove
 margin-top: -4px

Signed-off-by: Hung-Han (Henry) Chen <1474479+chenhunghan@users.noreply.github.com>
---
 .../+workloads-deployments/deployment-scale-dialog.scss       | 4 +---
 .../+workloads-deployments/deployment-scale-dialog.tsx        | 2 +-
 2 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/renderer/components/+workloads-deployments/deployment-scale-dialog.scss b/src/renderer/components/+workloads-deployments/deployment-scale-dialog.scss
index 6da6edf0ab..0f223a429a 100644
--- a/src/renderer/components/+workloads-deployments/deployment-scale-dialog.scss
+++ b/src/renderer/components/+workloads-deployments/deployment-scale-dialog.scss
@@ -28,9 +28,7 @@
     }
 
     .plus-minus-container {
-      margin-left: $margin * 2
-      // for vertical align with .slider-container
-      margin-top: -4px;
+      margin-left: $margin * 2;
     }
 
     .warning {
diff --git a/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx b/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx
index a64bb5c955..1073442ffa 100644
--- a/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx
+++ b/src/renderer/components/+workloads-deployments/deployment-scale-dialog.tsx
@@ -103,7 +103,7 @@ export class DeploymentScaleDialog extends Component<Props> {
           <div className="desired-scale" data-testid="desired-scale">
             <Trans>Desired number of replicas</Trans>: {desiredReplicas}
           </div>
-          <div className="slider-container">
+          <div className="slider-container flex align-center">
             <Slider value={desiredReplicas} max={scaleMax} onChange={onChange as any /** see: https://github.com/mui-org/material-ui/issues/20191 */}/>
           </div>
           <div className="plus-minus-container">