From 2c5ad51b47e2fc0b23fd5716bcf8dbe89b51097c Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Wed, 3 Mar 2021 14:39:26 +0300
Subject: [PATCH] Adding ids to all sections

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 .../components/+preferences/preferences.scss  |  3 --
 .../components/+preferences/preferences.tsx   | 36 +++++++++----------
 2 files changed, 17 insertions(+), 22 deletions(-)

diff --git a/src/renderer/components/+preferences/preferences.scss b/src/renderer/components/+preferences/preferences.scss
index 87942d4646..5c02312432 100644
--- a/src/renderer/components/+preferences/preferences.scss
+++ b/src/renderer/components/+preferences/preferences.scss
@@ -1,5 +1,2 @@
 .Preferences {
-  .extensions {
-    --flex-gap: calc(var(--unit) * 2);
-  }
 }
\ No newline at end of file
diff --git a/src/renderer/components/+preferences/preferences.tsx b/src/renderer/components/+preferences/preferences.tsx
index 025dcb774a..5869fbe481 100644
--- a/src/renderer/components/+preferences/preferences.tsx
+++ b/src/renderer/components/+preferences/preferences.tsx
@@ -49,7 +49,7 @@ export class Preferences extends React.Component {
               onChange={({ value }: SelectOption) => preferences.colorTheme = value}
             />
           </section>
-          <section>
+          <section id="proxy">
             <h2>Proxy</h2>
             <SubTitle title="HTTP Proxy"/>
             <Input
@@ -75,7 +75,7 @@ export class Preferences extends React.Component {
               Does not affect cluster communications!
             </small>
           </section>
-          <section>
+          <section id="startup">
             <h2>Start-up</h2>
             <SubTitle title="Automatic Start-up"/>
             <Checkbox
@@ -86,33 +86,31 @@ export class Preferences extends React.Component {
           </section>
         </section>
 
-        <section>
+        <section id="kubernetes">
           <h1>Kubernetes</h1>
-          <section>
+          <section id="kubectl">
             <h2>Kubectl binary</h2>
             <KubectlBinaries preferences={preferences}/>
           </section>
-          <section>
+          <section id="helm">
             <h2>Helm Charts</h2>
             <HelmCharts/>
           </section>
         </section>
 
-        <section>
+        <section id="extensions">
           <h1>Extensions</h1>
-          <div className="extensions flex column gaps">
-            {appPreferenceRegistry.getItems().map(({ title, components: { Hint, Input } }, index) => {
-              return (
-                <section key={index}>
-                  <h2>{title}</h2>
-                  <Input/>
-                  <small className="hint">
-                    <Hint/>
-                  </small>
-                </section>
-              );
-            })}
-          </div>
+          {appPreferenceRegistry.getItems().map(({ title, components: { Hint, Input } }, index) => {
+            return (
+              <section key={index} id={title}>
+                <h2>{title}</h2>
+                <Input/>
+                <small className="hint">
+                  <Hint/>
+                </small>
+              </section>
+            );
+          })}
         </section>
       </PageLayout>
     );