From ce94a1a9a1a7c0fba0b56ae5c1dcf20b18cb978e Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Thu, 16 Nov 2023 15:58:34 +0300
Subject: [PATCH] change tab html element from anchor to span

---
 apps/vyper/src/app/components/CompilerButton.tsx | 4 ++--
 apps/vyper/src/app/components/VyperResult.tsx    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/vyper/src/app/components/CompilerButton.tsx b/apps/vyper/src/app/components/CompilerButton.tsx
index 39432263c7..bb857571ea 100644
--- a/apps/vyper/src/app/components/CompilerButton.tsx
+++ b/apps/vyper/src/app/components/CompilerButton.tsx
@@ -118,10 +118,10 @@ function CompilerButton({contract, setOutput, compilerUrl, resetCompilerState}:
   }
 
   return (
-    <Button data-id="compile" onClick={compileContract} variant="primary" title={contract} className="d-flex flex-column">
+    <button data-id="compile" onClick={compileContract} title={contract} className="d-flex flex-column btn btn-primary btn-block">
       <span>Compile</span>
       <span className="overflow-hidden text-truncate text-nowrap">{contract}</span>
-    </Button>
+    </button>
   )
 }
 
diff --git a/apps/vyper/src/app/components/VyperResult.tsx b/apps/vyper/src/app/components/VyperResult.tsx
index 94544de273..10e2a30a87 100644
--- a/apps/vyper/src/app/components/VyperResult.tsx
+++ b/apps/vyper/src/app/components/VyperResult.tsx
@@ -48,8 +48,8 @@ function VyperResult({ output, themeColor }: VyperResultProps) {
   }
 
   return (
-    <Tabs id="result" activeKey={active} onSelect={(key: any) => setActive(key)}>
-      <Tab eventKey="abi" title="ABI">
+    <Tabs id="result" activeKey={active} onSelect={(key: any) => setActive(key)} justify>
+      <Tab eventKey="abi" title="ABI" as={'span'}>
         <CopyToClipboard getContent={() => JSON.stringify(Object.values(output)[0]['abi'])}>
           <Button variant="info" className="copy" data-id="copy-abi">
             Copy ABI