From 2fbad87fbd7e4a493bb71de45a6cce771892f88b Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Tue, 1 Feb 2022 14:54:16 +0300
Subject: [PATCH] Use light theme for all dialog inputs

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 .../components/+config-secrets/add-secret-dialog.tsx         | 3 +++
 .../components/+preferences/add-helm-repo-dialog.tsx         | 5 +++++
 .../+user-management/+cluster-role-bindings/dialog.tsx       | 1 +
 .../+user-management/+cluster-roles/add-dialog.tsx           | 1 +
 .../components/+user-management/+role-bindings/dialog.tsx    | 1 +
 .../+user-management/+service-accounts/create-dialog.tsx     | 1 +
 .../+workloads-cronjobs/cronjob-trigger-dialog.tsx           | 1 +
 .../components/cluster-local-terminal-settings.tsx           | 2 ++
 .../cluster-settings/components/cluster-metrics-setting.tsx  | 1 -
 .../components/cluster-prometheus-setting.tsx                | 1 -
 .../components/item-object-list/item-list-layout.scss        | 2 +-
 src/renderer/port-forward/port-forward-dialog.tsx            | 1 +
 12 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/+config-secrets/add-secret-dialog.tsx b/src/renderer/components/+config-secrets/add-secret-dialog.tsx
index e0cdd843f4..67ec0423ee 100644
--- a/src/renderer/components/+config-secrets/add-secret-dialog.tsx
+++ b/src/renderer/components/+config-secrets/add-secret-dialog.tsx
@@ -157,6 +157,7 @@ export class AddSecretDialog extends React.Component<Props> {
             return (
               <div key={index} className="secret-field flex gaps auto align-center">
                 <Input
+                  lightTheme
                   className="key"
                   placeholder="Name"
                   title={key}
@@ -165,6 +166,7 @@ export class AddSecretDialog extends React.Component<Props> {
                   value={key} onChange={v => item.key = v}
                 />
                 <Input
+                  lightTheme
                   multiLine maxRows={5}
                   required={required}
                   className="value"
@@ -205,6 +207,7 @@ export class AddSecretDialog extends React.Component<Props> {
             <div className="secret-name">
               <SubTitle title="Secret name" />
               <Input
+                lightTheme
                 autoFocus required
                 placeholder="Name"
                 trim
diff --git a/src/renderer/components/+preferences/add-helm-repo-dialog.tsx b/src/renderer/components/+preferences/add-helm-repo-dialog.tsx
index bd25940c84..384e515567 100644
--- a/src/renderer/components/+preferences/add-helm-repo-dialog.tsx
+++ b/src/renderer/components/+preferences/add-helm-repo-dialog.tsx
@@ -104,6 +104,7 @@ export class AddHelmRepoDialog extends React.Component<Props> {
     return(
       <div className="flex gaps align-center">
         <Input
+          lightTheme
           placeholder={placeholder}
           validators={isPath}
           className="box grow"
@@ -132,10 +133,12 @@ export class AddHelmRepoDialog extends React.Component<Props> {
         {this.renderFileInput(`Certificate file`, FileType.CertFile, AddHelmRepoDialog.certExtensions)}
         <SubTitle title="Chart Repository Credentials" />
         <Input
+          lightTheme
           placeholder="Username"
           value={this.helmRepo.username} onChange= {v => this.helmRepo.username = v}
         />
         <Input
+          lightTheme
           type="password"
           placeholder="Password"
           value={this.helmRepo.password} onChange={v => this.helmRepo.password = v}
@@ -159,6 +162,7 @@ export class AddHelmRepoDialog extends React.Component<Props> {
           <WizardStep contentClass="flow column" nextLabel="Add" next={() => this.addCustomRepo()}>
             <div className="flex column gaps">
               <Input
+                lightTheme
                 autoFocus required
                 placeholder="Helm repo name"
                 trim
@@ -166,6 +170,7 @@ export class AddHelmRepoDialog extends React.Component<Props> {
                 value={this.helmRepo.name} onChange={v => this.helmRepo.name = v}
               />
               <Input
+                lightTheme 
                 required
                 placeholder="URL"
                 validators={isUrl}
diff --git a/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx b/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx
index 02fb12faf3..6203e899bc 100644
--- a/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx
+++ b/src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx
@@ -205,6 +205,7 @@ export class ClusterRoleBindingDialog extends React.Component<Props> {
 
         <SubTitle title="Binding Name" />
         <Input
+          lightTheme
           placeholder="Name of ClusterRoleBinding ..."
           disabled={this.isEditing}
           value={this.bindingName}
diff --git a/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx b/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx
index dedd371764..3ddfa086d6 100644
--- a/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx
+++ b/src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx
@@ -75,6 +75,7 @@ export class AddClusterRoleDialog extends React.Component<Props> {
           >
             <SubTitle title="ClusterRole Name" />
             <Input
+              lightTheme
               required autoFocus
               placeholder="Name"
               iconLeft="supervisor_account"
diff --git a/src/renderer/components/+user-management/+role-bindings/dialog.tsx b/src/renderer/components/+user-management/+role-bindings/dialog.tsx
index da6192cb04..d671d61364 100644
--- a/src/renderer/components/+user-management/+role-bindings/dialog.tsx
+++ b/src/renderer/components/+user-management/+role-bindings/dialog.tsx
@@ -203,6 +203,7 @@ export class RoleBindingDialog extends React.Component<Props> {
 
         <SubTitle title="Binding Name" />
         <Input
+          lightTheme
           disabled={this.isEditing}
           value={this.bindingName}
           onChange={value => this.bindingName = value}
diff --git a/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx b/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx
index a9b5b92a30..18eea9942a 100644
--- a/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx
+++ b/src/renderer/components/+user-management/+service-accounts/create-dialog.tsx
@@ -72,6 +72,7 @@ export class CreateServiceAccountDialog extends React.Component<Props> {
           <WizardStep nextLabel="Create" next={this.createAccount}>
             <SubTitle title="Account Name" />
             <Input
+              lightTheme
               autoFocus
               required
               placeholder="Enter a name"
diff --git a/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx b/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx
index 689dd87ee1..bb3538b602 100644
--- a/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx
+++ b/src/renderer/components/+workloads-cronjobs/cronjob-trigger-dialog.tsx
@@ -105,6 +105,7 @@ export class CronJobTriggerDialog extends Component<Props> {
         </div>
         <div className="flex gaps">
           <Input
+            lightTheme
             required autoFocus
             placeholder={this.jobName}
             trim
diff --git a/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx b/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx
index b12cb638b0..b35441dc2d 100644
--- a/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-local-terminal-settings.tsx
@@ -162,6 +162,7 @@ export const ClusterLocalTerminalSetting = observer(({ cluster }: Props) => {
                     material="close"
                     title="Clear"
                     onClick={() => setAndCommitDirectory("")}
+                    smallest
                   />
                 )
               }
@@ -169,6 +170,7 @@ export const ClusterLocalTerminalSetting = observer(({ cluster }: Props) => {
                 material="folder"
                 title="Pick from filesystem"
                 onClick={openFilePicker}
+                smallest
               />
             </>
           }
diff --git a/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx
index eeb524b60b..95bb238299 100644
--- a/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-metrics-setting.tsx
@@ -85,7 +85,6 @@ export class ClusterMetricsSetting extends React.Component<Props> {
           options={Object.values(ClusterMetricsResourceType)}
           onChange={this.onChangeSelect}
           formatOptionLabel={this.formatOptionLabel}
-          lightTheme
         />
         <Button
           primary
diff --git a/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx b/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx
index 08a644619c..849a415884 100644
--- a/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx
+++ b/src/renderer/components/cluster-settings/components/cluster-prometheus-setting.tsx
@@ -122,7 +122,6 @@ export class ClusterPrometheusSetting extends React.Component<Props> {
                     this.onSaveProvider();
                   }}
                   options={this.options}
-                  lightTheme
                 />
                 <small className="hint">What query format is used to fetch metrics from Prometheus</small>
               </>
diff --git a/src/renderer/components/item-object-list/item-list-layout.scss b/src/renderer/components/item-object-list/item-list-layout.scss
index c9941474dc..2cd8747798 100644
--- a/src/renderer/components/item-object-list/item-list-layout.scss
+++ b/src/renderer/components/item-object-list/item-list-layout.scss
@@ -21,7 +21,7 @@
     }
 
     .SearchInput label {
-      padding: 7px; // Align with sibling selector
+      height: 34px; // Align with sibling selector
     }
   }
 
diff --git a/src/renderer/port-forward/port-forward-dialog.tsx b/src/renderer/port-forward/port-forward-dialog.tsx
index a36e6ede61..9edd2f9fda 100644
--- a/src/renderer/port-forward/port-forward-dialog.tsx
+++ b/src/renderer/port-forward/port-forward-dialog.tsx
@@ -109,6 +109,7 @@ class NonInjectedPortForwardDialog extends Component<Props & Dependencies> {
               value={this.desiredPort === 0 ? "" : String(this.desiredPort)}
               placeholder={"Random"}
               onChange={this.changePort}
+              lightTheme
             />
           </div>
           <Checkbox