From 92686f3f68a33952dcfa7aa4e873ce4556ba660b Mon Sep 17 00:00:00 2001
From: aniket-engg <aniketengg.225@gmail.com>
Date: Thu, 20 Jun 2024 17:24:59 +0530
Subject: [PATCH] button improvement

---
 .../src/lib/contract-selection.tsx            | 135 +++++++++---------
 1 file changed, 65 insertions(+), 70 deletions(-)

diff --git a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx
index a80eb237e7..32c1bd78cd 100644
--- a/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx
+++ b/libs/remix-ui/solidity-compiler/src/lib/contract-selection.tsx
@@ -9,7 +9,6 @@ import { AppModal } from '@remix-ui/app'
 import { SolScanTable } from './solScanTable'
 import axios from 'axios'
 
-
 import './css/style.css'
 import { CustomTooltip } from '@remix-ui/helper'
 const _paq = (window._paq = window._paq || [])
@@ -325,7 +324,7 @@ export const ContractSelection = (props: ContractSelectionProps) => {
             }
             await plugin.call('notification', 'modal', modal)
           }
-          
+
         }
       })
     }
@@ -374,83 +373,80 @@ export const ContractSelection = (props: ContractSelectionProps) => {
             </select>
           </div>
           <article className="mt-2 pb-0">
-          <button
-              id="runStaticAnalysis"
-              className="btn btn-outline-secondary btn-block"
-              onClick={() => {
-                runStaticAnalysis()
-              }}
+            <CustomTooltip
+              placement={'auto-end'}
+              tooltipId="runStaticAnalysisTooltip"
+              tooltipClasses="text-nowrap"
+              tooltipText={`${intl.formatMessage({
+                id: 'solidity.runStaticAnalysis.iconTooltip'
+              })}`}
             >
-              <CustomTooltip
-                placement={'auto-end'}
-                tooltipId="runStaticAnalysisTooltip"
-                tooltipClasses="text-nowrap"
-                tooltipText={`${intl.formatMessage({
-                  id: 'solidity.runStaticAnalysis.iconTooltip'
-                })}`}
+              <button
+                id="runStaticAnalysis"
+                className="btn border btn-block"
+                onClick={() => {
+                  runStaticAnalysis()
+                }}
               >
-                <span>
-                  <FormattedMessage id="solidity.runStaticAnalysis" />
-                </span>
-              </CustomTooltip>
-            </button>
-            <button
-              id="runSolidityScan"
-              className="btn btn-outline-secondary btn-block"
-              onClick={() => {
-                runSolidityScan()
-              }}
+                <FormattedMessage id="solidity.runStaticAnalysis" />
+              </button>
+            </CustomTooltip>
+            <CustomTooltip
+              placement={'auto-end'}
+              tooltipId="runSolidityScanTooltip"
+              tooltipClasses="text-nowrap"
+              tooltipText={`${intl.formatMessage({
+                id: 'solidity.solScan.iconTooltip'
+              })}`}
             >
-              <CustomTooltip
-                placement={'auto-end'}
-                tooltipId="runSolidityScanTooltip"
-                tooltipClasses="text-nowrap"
-                tooltipText={`${intl.formatMessage({
-                  id: 'solidity.solScan.iconTooltip'
-                })}`}
+              <button
+                id="runSolidityScan"
+                className="btn border btn-block"
+                onClick={() => {
+                  runSolidityScan()
+                }}
               >
-                <span>
-                  <FormattedMessage id="solidity.runSolidityScan" />
-                </span>
-              </CustomTooltip>
-            </button>
-            <button
-              id="publishOnIpfs"
-              className="btn btn-outline-secondary btn-block"
-              onClick={() => {
-                handlePublishToStorage('ipfs')
-              }}
+                <FormattedMessage id="solidity.runSolidityScan" />
+              </button>
+            </CustomTooltip>
+            <CustomTooltip
+              placement={'auto-end'}
+              tooltipId="publishOnIpfsTooltip"
+              tooltipClasses="text-nowrap"
+              tooltipText={`${intl.formatMessage({
+                id: 'solidity.publishOn'
+              })} Ipfs`}
             >
-              <CustomTooltip
-                placement={'auto-end'}
-                tooltipId="publishOnIpfsTooltip"
-                tooltipClasses="text-nowrap"
-                tooltipText={`${intl.formatMessage({
-                  id: 'solidity.publishOn'
-                })} Ipfs`}
+              <button
+                id="publishOnIpfs"
+                className="btn border btn-block"
+                onClick={() => {
+                  handlePublishToStorage('ipfs')
+                }}
               >
+
                 <span>
                   <span>
                     <FormattedMessage id="solidity.publishOn" /> Ipfs
                   </span>
                   <img id="ipfsLogo" className="remixui_storageLogo ml-2" src="assets/img/ipfs.webp" />
                 </span>
-              </CustomTooltip>
-            </button>
-            <button
-              id="publishOnSwarm"
-              className="btn btn-outline-secondary btn-block"
-              onClick={() => {
-                handlePublishToStorage('swarm')
-              }}
+              </button>
+            </CustomTooltip>
+            <CustomTooltip
+              placement={'auto-end'}
+              tooltipId="publishOnSwarmTooltip"
+              tooltipClasses="text-nowrap"
+              tooltipText={`${intl.formatMessage({
+                id: 'solidity.publishOn'
+              })} Swarm`}
             >
-              <CustomTooltip
-                placement={'auto-end'}
-                tooltipId="publishOnSwarmTooltip"
-                tooltipClasses="text-nowrap"
-                tooltipText={`${intl.formatMessage({
-                  id: 'solidity.publishOn'
-                })} Swarm`}
+              <button
+                id="publishOnSwarm"
+                className="btn border btn-block"
+                onClick={() => {
+                  handlePublishToStorage('swarm')
+                }}
               >
                 <span>
                   <span>
@@ -458,9 +454,8 @@ export const ContractSelection = (props: ContractSelectionProps) => {
                   </span>
                   <img id="swarmLogo" className="remixui_storageLogo ml-2" src="assets/img/swarm.webp" />
                 </span>
-              </CustomTooltip>
-            </button>
-
+              </button>
+            </CustomTooltip>
             <CustomTooltip
               placement={'auto-end'}
               tooltipId="CompilationDetailsTooltip"
@@ -469,7 +464,7 @@ export const ContractSelection = (props: ContractSelectionProps) => {
             >
               <button
                 data-id="compilation-details"
-                className="btn btn-outline-secondary btn-block"
+                className="btn border btn-block"
                 onClick={async () => {
                   details()
                   await (api as any).call('compilationDetails', 'showDetails', payload)