contract verificatin fixes

Author: Aniket-Engg

apps/contract-verification/src/app/components/ConfigInput.tsx

@@ -37,7 +37,7 @@ export const ConfigInput: React.FC<ConfigInputProps> = ({ label, id, secret, ini
   }
 
   return (
-    <div className="form-group small mb-0">
+    <div className="small mb-0">
       <label className='mt-3' htmlFor={id}>{label}</label>
       <div className="d-flex flex-row justify-content-start">
         <input

apps/contract-verification/src/app/components/ContractAddressInput.tsx

@@ -24,9 +24,9 @@ export const ContractAddressInput: React.FC<ContractAddressInputProps> = ({ labe
   }
 
   return (
-    <div className="form-group">
+    <div className="mb-3">
       <label htmlFor={id}>{label}</label>
-      <div>{contractAddressError && <div className="text-danger">{contractAddressError}</div>}</div>
+      {contractAddressError && <div className="text-danger">{contractAddressError}</div>}
       <input type="text" className="form-control" id={id} placeholder="0x2738d13E81e..." value={contractAddress} onChange={handleAddressChange} />
     </div>
   )

apps/contract-verification/src/app/components/ContractDropdown.tsx

@@ -42,10 +42,10 @@ export const ContractDropdown: React.FC<ContractDropdownProps> = ({ label, id, s
   const hasContracts = compilationOutput && Object.keys(compilationOutput).length > 0
 
   return (
-    <div className="form-group">
+    <div className="mb-3">
       <label htmlFor={id}><FormattedMessage id="contract-verification.contractDropdownLabel" defaultMessage={label} values={{ label }} /></label>
       <select value={selectedContract ? JSON.stringify(selectedContract) : ''}
-        className={`form-control form-select pe-4 ${!hasContracts ? 'disabled-cursor text-warning' : ''}`}
+        className={`form-select pe-4 mt-1 ${!hasContracts ? 'disabled-cursor text-warning' : ''}`}
         id={id}
         disabled={!hasContracts}
         onChange={handleSelectContract}

apps/contract-verification/src/app/views/SettingsView.tsx

@@ -41,7 +41,7 @@ export const SettingsView = () => {
             <CustomTooltip tooltipText="Use Sourcify API v1 instead of v2. Necessary for alternative Sourcify instances that did not upgrade.">
               <div className="d-flex py-1 align-items-center custom-control custom-checkbox">
                 <input
-                  className="form-check-input custom-control-input"
+                  className="form-check-input ms-1"
                   type="checkbox"
                   id="sourcify-use-v1-api"
                   checked={chainSettings.verifiers['Sourcify']?.useV1API ?? false}

apps/contract-verification/src/app/views/VerifyView.tsx

@@ -205,10 +205,10 @@ export const VerifyView = () => {
         abiEncodingError={abiEncodingError}
         setAbiEncodingError={setAbiEncodingError}
       />}
-      <div className="pt-3">
-        <div className="d-flex py-1 align-items-center form-check">
+      <div className="pt-1">
+        <div className="d-flex align-items-center form-check">
           <input id="has-proxy" className="form-check-input" type="checkbox" checked={!!hasProxy} onChange={(e) => setHasProxy(e.target.checked)} />
-          <label htmlFor="has-proxy" className="m-0 form-check-label" style={{ paddingTop: '2px' }}>
+          <label htmlFor="has-proxy" className="ms-1 form-check-label" style={{ paddingTop: '2px' }}>
             <FormattedMessage id="contract-verification.proxyInputLabel" defaultMessage={'The deployed contract is behind a proxy'} />
           </label>
         </div>
@@ -229,9 +229,9 @@ export const VerifyView = () => {
 
           return (
             <div key={verifierId} className="pt-2">
-              <div className="d-flex py-1 align-items-center form-check">
+              <div className="d-flex align-items-center form-check">
                 <input
-                  className="form-check-input"
+                  className="form-check-input mb-1"
                   type="checkbox"
                   id={`verifier-${verifierId}`}
                   checked={!!enabledVerifiers[verifierId]}
@@ -240,8 +240,8 @@ export const VerifyView = () => {
                 />
                 <label
                   htmlFor={`verifier-${verifierId}`}
-                  className={`m-0 form-check-label large  fw-bold${!disabledVerifier ? '' : ' text-secondary'}`}
-                  style={{ fontSize: '1rem', color: 'var(--text)' }}
+                  className={`ms-1 form-check-label large  fw-bold${!disabledVerifier ? '' : ' text-secondary'}`}
+                  style={{ fontSize: '1rem' }}
                 >
                   {verifierId}
                 </label>