Merge branch 'main' into fharper/css

konstructio · Apr 18, 2024 · 4848a4e · 4848a4e
2 parents 7b5f60c + b046f42
commit 4848a4e
Show file tree

Hide file tree

Showing 29 changed files with 57 additions and 57 deletions.
diff --git a/charts/docs/Chart.yaml b/charts/docs/Chart.yaml
@@ -1,6 +1,6 @@
 apiVersion: v2
-appVersion: d45b8db
+appVersion: 7774ed5
 description: Kubefirst documentation Helm chart
 name: docs
 type: application
-version: 1.106.0
+version: 1.107.0
diff --git a/docs/akamai/quick-start/install/cli.mdx b/docs/akamai/quick-start/install/cli.mdx
@@ -34,14 +34,14 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Akamai"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
   <!-- markdownlint-disable MD049 -->
-  {/*<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  {/*<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Akamai"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/docs/aws/quick-start/install/cli.mdx b/docs/aws/quick-start/install/cli.mdx
@@ -34,13 +34,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Aws"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Aws"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/docs/civo/quick-start/install/cli.mdx b/docs/civo/quick-start/install/cli.mdx
@@ -34,13 +34,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Civo"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Civo"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/docs/do/quick-start/install/cli.mdx b/docs/do/quick-start/install/cli.mdx
@@ -35,14 +35,14 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <SpaceRegion />
     <CommonTerminalOutput cloud="Do"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <SpaceRegion />

diff --git a/docs/do/quick-start/install/marketplace.mdx b/docs/do/quick-start/install/marketplace.mdx
@@ -18,7 +18,7 @@ Log into your DigitalOcean account and navigate to the [kubefirst Marketplace pa
 1. Click "Install App", it will open a new tab.
 2. On the new tab, click "Install".
 3. Choose the datacenter region. It doesn't matter much as this cluster will be use to install kubefirst.
-4. Lower the nodes plan to `1 GB RAM usable (2 GB Total) / 1 vCPU / 50 GB Disk`
+4. Lower the nodes plan to `2 GB RAM / 1 vCPU / 50 GB Disk`
 5. Reduce the nodes count to `2`
 6. Name the cluster `installer`
 7. Click "Create Cluster" and wait until the cluster is ready

diff --git a/docs/gcp/quick-start/install/cli.mdx b/docs/gcp/quick-start/install/cli.mdx
@@ -34,13 +34,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Gcp"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Gcp"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/docs/k3s/quick-start/install/cli.mdx b/docs/k3s/quick-start/install/cli.mdx
@@ -35,13 +35,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 <Tabs groupId="git_provider" defaultValue="gitlab" queryString>
   <!-- markdownlint-disable MD049 -->
   {/*<Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="K3s"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>*/}
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="K3s"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/docs/vultr/quick-start/install/cli.mdx b/docs/vultr/quick-start/install/cli.mdx
@@ -34,13 +34,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Vultr"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Vultr"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/versioned_docs/version-2.1/aws/quick-start/install/cli.mdx b/versioned_docs/version-2.1/aws/quick-start/install/cli.mdx
@@ -26,7 +26,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <CommonGitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -40,7 +40,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <CommonGitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.1/civo/quick-start/install/cli.mdx b/versioned_docs/version-2.1/civo/quick-start/install/cli.mdx
@@ -25,7 +25,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <GitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -37,7 +37,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <GitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.2/aws/quick-start/install/cli.mdx b/versioned_docs/version-2.2/aws/quick-start/install/cli.mdx
@@ -26,7 +26,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <CommonGitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -40,7 +40,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <CommonGitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.2/civo/quick-start/install/cli.mdx b/versioned_docs/version-2.2/civo/quick-start/install/cli.mdx
@@ -25,7 +25,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <GitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -37,7 +37,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <GitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.2/do/quick-start/install/cli.mdx b/versioned_docs/version-2.2/do/quick-start/install/cli.mdx
@@ -28,7 +28,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <GitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -42,7 +42,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <GitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.2/gcp/quick-start/install/cli.mdx b/versioned_docs/version-2.2/gcp/quick-start/install/cli.mdx
@@ -28,7 +28,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <GitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -42,7 +42,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-<TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <GitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.2/vultr/quick-start/install/cli.mdx b/versioned_docs/version-2.2/vultr/quick-start/install/cli.mdx
@@ -28,7 +28,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 );
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
   <GitHubPrerequisites />
 
   <CommonCloudPrerequisites />
@@ -42,7 +42,7 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
   <CommonClusterConnectivity />
 
   </TabItem>
-  <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
   <GitLabPrerequisites />
 
   <CommonCloudPrerequisites />

diff --git a/versioned_docs/version-2.3/aws/quick-start/install/cli.mdx b/versioned_docs/version-2.3/aws/quick-start/install/cli.mdx
@@ -34,13 +34,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Aws"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Aws"  minutes="10" handoffScreen={GitLabHandoffScreen} />

diff --git a/versioned_docs/version-2.3/civo/quick-start/install/cli.mdx b/versioned_docs/version-2.3/civo/quick-start/install/cli.mdx
@@ -34,13 +34,13 @@ export const TabLabel = ({ imgSrc, label, alt }) => (
 
 <Tabs groupId="git_provider" defaultValue="github" queryString>
 
-  <TabItem attributes={{ className: styles.github }} value="github" label={<TabLabel src="https://assets.kubefirst.com/console/github.svg" label="GitHub" alt="GitHub logo" />}>
+    <TabItem attributes={{ className: styles.github }} value="github" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/github.svg" alt="GitHub logo" /><span>GitHub</span></div> }>
     <GitHubPrerequisites />
     <GitHubClusterCreateCmd />
     <CommonTerminalOutput cloud="Civo"  minutes="10" handoffScreen={GitHubHandoffScreen} />
   </TabItem>
 
-    <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={<TabLabel src="https://assets.kubefirst.com/console/gitlab.svg" label="GitLab" alt="GitLab logo" />}>
+      <TabItem attributes={{ className: styles.gitlab }} value="gitlab" label={ <div className="git-tab"><img src="https://assets.kubefirst.com/console/gitlab.svg" alt="GitLab logo" /><span>GitLab</span></div> }>
     <GitLabPrerequisites />
     <GitLabClusterCreateCmd />
     <CommonTerminalOutput cloud="Civo"  minutes="10" handoffScreen={GitLabHandoffScreen} />