From ee6291f2a20c8231e76cc21a84bb3829a57648f2 Mon Sep 17 00:00:00 2001
From: Satyam Bansal <satyamsgsits1994@gmail.com>
Date: Wed, 26 Jun 2024 19:51:33 +0530
Subject: [PATCH] Add verify contract checkbox

---
 plugin/src/features/Deployment/index.tsx  | 31 ++++++++++--------
 plugin/src/features/Deployment/styles.css | 40 +++++++++++++++++++++++
 2 files changed, 57 insertions(+), 14 deletions(-)

diff --git a/plugin/src/features/Deployment/index.tsx b/plugin/src/features/Deployment/index.tsx
index 7f7a15b8..3890ebb4 100644
--- a/plugin/src/features/Deployment/index.tsx
+++ b/plugin/src/features/Deployment/index.tsx
@@ -351,20 +351,23 @@ export const Deployment: React.FC<DeploymentProps> = ({ setActiveTab }) => {
                   Deploy {shouldRunVerification ? ' and Verify' : ''}
                 </button>
 
-                <input
-                  id="shouldRunVerificationChk"
-                  name="shouldRunVerificationChk"
-                  type="checkbox"
-                  checked={shouldRunVerification}
-                  onChange={(e) => {
-                    setShouldRunVerification(e.target.checked)
-                  }}
-                  disabled={!isValidSolidity || !currentFilename || isVerifying || !selectedChainName}
-                  aria-disabled={!isValidSolidity || !currentFilename || isVerifying || !selectedChainName}
-                />
-                <label className="ml-1" htmlFor="shouldRunVerificationChk">
-                  Verify Contract
-                </label>
+                <div className="flex mt-1 custom-checkbox">
+                  <input
+                    id="shouldRunVerificationChk"
+                    name="shouldRunVerificationChk"
+                    type="checkbox"
+                    checked={shouldRunVerification}
+                    onChange={(e) => {
+                      setShouldRunVerification(e.target.checked)
+                    }}
+                    disabled={!isValidSolidity || !currentFilename || isVerifying || !selectedChainName}
+                    aria-disabled={!isValidSolidity || !currentFilename || isVerifying || !selectedChainName}
+                    className="w-4 h-4"
+                  />
+                  <label className="ml-1 mt-2" htmlFor="shouldRunVerificationChk">
+                    Verify Contract
+                  </label>
+                </div>
               </div>
             ) : (
               <></>
diff --git a/plugin/src/features/Deployment/styles.css b/plugin/src/features/Deployment/styles.css
index 80782e8d..6f55912c 100644
--- a/plugin/src/features/Deployment/styles.css
+++ b/plugin/src/features/Deployment/styles.css
@@ -6,3 +6,43 @@
     opacity: 0.5;
     cursor: not-allowed;
 }
+
+.w-4 {
+    width: 16px;
+}
+
+.h-4 {
+    height: 16px;
+}
+
+input[type=checkbox] {
+    position: relative;
+    cursor: pointer;
+}
+
+input[type=checkbox]:before {
+    content: "";
+    display: block;
+    position: absolute;
+    width: 16px;
+    height: 16px;
+    top: 0;
+    left: 0;
+    border: 2px solid #555555;
+    border-radius: 3px;
+}
+
+input[type=checkbox]:checked:after {
+    content: "";
+    display: block;
+    width: 5px;
+    height: 10px;
+    border: solid ;
+    border-width: 0 2px 2px 0;
+    -webkit-transform: rotate(45deg);
+    -ms-transform: rotate(45deg);
+    transform: rotate(45deg);
+    position: absolute;
+    top: 2px;
+    left: 6px;
+}
\ No newline at end of file