Recaptcha dark theme patch

icssc · Jan 24, 2024 · 62dc70c · 62dc70c
1 parent 614103d
commit 62dc70c
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/site/src/component/ReviewForm/ReviewForm.scss b/site/src/component/ReviewForm/ReviewForm.scss
@@ -8,6 +8,14 @@
       border-color: var(--overlay4);
     }
   }
+
+  // monkey patch recaptcha dark theme bug (crop out white borders)
+  .g-recaptcha {
+    overflow: hidden;
+    width: 302px;
+    height: 76px;
+    border-radius: 4px;
+  }
 }
 
 .review-form {

diff --git a/site/src/component/ReviewForm/ReviewForm.tsx b/site/src/component/ReviewForm/ReviewForm.tsx
@@ -451,12 +451,14 @@ const ReviewForm: FC<ReviewFormProps> = (props) => {
           </Row>
           <Row>
             <Col className="mb-3 review-form-submit">
-              <ReCAPTCHA
-                className="d-inline"
-                sitekey="6Le6rfIUAAAAAOdqD2N-QUEW9nEtfeNyzkXucLm4"
-                theme={darkMode ? 'dark' : 'light'}
-                onChange={(token) => setCaptchaToken(token ?? '')}
-              />
+              <div className="g-recaptcha">
+                <ReCAPTCHA
+                  className="d-inline"
+                  sitekey="6Le6rfIUAAAAAOdqD2N-QUEW9nEtfeNyzkXucLm4"
+                  theme={darkMode ? 'dark' : 'light'}
+                  onChange={(token) => setCaptchaToken(token ?? '')}
+                />
+              </div>
               <div>
                 <Button className="py-2 px-4 float-right" type="submit" variant="secondary">
                   Submit