From 63776954e1a31419fe87c7881a8e7ecdee18c0c1 Mon Sep 17 00:00:00 2001
From: Teddy Middleton-Smith <edward.middletonsmith@gmail.com>
Date: Sun, 16 Mar 2025 18:59:46 +0000
Subject: [PATCH] Fix(UI): Contact Us page styling for receive-marketing
 checkbox and CAPTCHA.

---
 static/css/pages/core/contact.css       | 28 +++++++++++--------------
 static/dist/css/core_contact.bundle.css | 28 +++++++++++--------------
 2 files changed, 24 insertions(+), 32 deletions(-)

diff --git a/static/css/pages/core/contact.css b/static/css/pages/core/contact.css
index c1901c2f..e43f1496 100644
--- a/static/css/pages/core/contact.css
+++ b/static/css/pages/core/contact.css
@@ -22,12 +22,10 @@
     gap: 1.5rem;
     margin-bottom: 1rem;
 }
-
 .form-label {
     padding-top: 0.5rem;
     font-weight: 500;
 }
-
 .form-input {
     width: 100%;
     padding: 0.5rem;
@@ -35,30 +33,27 @@
     border-radius: 4px;
     font-size: 1rem;
 }
-
 textarea.form-input {
     min-height: 120px;
 }
 
 .marketing-consent input {
     display: inline-block;
-    margin-left: 18vw;
+    margin-left: 20%;
     margin-bottom: 1.25rem;
 }
 
-.container.captcha > div:first-child {
-    margin-left: 15vw;
-    margin-right: 15vw;
-}
 .container.captcha > div:first-child > label:first-child {
     display: flex;
     justify-content: center;
+    width: fit-content;
+    text-align: center;
+    margin: 0 auto;
 }
 .container.captcha > p:last-child{
     font-size: 0.9rem;
     margin: 1vh 0;
 }
-
 .container.captcha .altcha-main {
     padding-left: 1rem;
     padding-top: 0.75rem;
@@ -67,6 +62,14 @@ textarea.form-input {
 .container.captcha .altcha-main > :last-child {
     display: none;
 }
+.container.captcha .altcha,
+altcha-widget > div:first-child,
+.container.captcha > div > .altcha-widget > div {
+    width: fit-content;
+    display: flex;
+    margin-left: auto;
+    margin-right: auto;
+}
 
 input[type="submit"] {
     margin-left: 40%;
@@ -116,10 +119,6 @@ input[type="submit"]:hover {
         padding-top: 0;
     }
 
-    .marketing-consent {
-        padding-left: 0;
-    }
-
     .submit-button {
         margin-left: 0;
         width: 100%;
@@ -127,7 +126,4 @@ input[type="submit"]:hover {
 }
 
 @media (max-width: 400px) {
-    .container.recaptcha {
-        margin-left: -12vw;
-    }
 }
\ No newline at end of file
diff --git a/static/dist/css/core_contact.bundle.css b/static/dist/css/core_contact.bundle.css
index 78e0462c..fe0ec08d 100644
--- a/static/dist/css/core_contact.bundle.css
+++ b/static/dist/css/core_contact.bundle.css
@@ -22,12 +22,10 @@
     gap: 1.5rem;
     margin-bottom: 1rem;
 }
-
 .form-label {
     padding-top: 0.5rem;
     font-weight: 500;
 }
-
 .form-input {
     width: 100%;
     padding: 0.5rem;
@@ -35,30 +33,27 @@
     border-radius: 4px;
     font-size: 1rem;
 }
-
 textarea.form-input {
     min-height: 120px;
 }
 
 .marketing-consent input {
     display: inline-block;
-    margin-left: 18vw;
+    margin-left: 20%;
     margin-bottom: 1.25rem;
 }
 
-.container.captcha > div:first-child {
-    margin-left: 15vw;
-    margin-right: 15vw;
-}
 .container.captcha > div:first-child > label:first-child {
     display: flex;
     justify-content: center;
+    width: fit-content;
+    text-align: center;
+    margin: 0 auto;
 }
 .container.captcha > p:last-child{
     font-size: 0.9rem;
     margin: 1vh 0;
 }
-
 .container.captcha .altcha-main {
     padding-left: 1rem;
     padding-top: 0.75rem;
@@ -67,6 +62,14 @@ textarea.form-input {
 .container.captcha .altcha-main > :last-child {
     display: none;
 }
+.container.captcha .altcha,
+altcha-widget > div:first-child,
+.container.captcha > div > .altcha-widget > div {
+    width: fit-content;
+    display: flex;
+    margin-left: auto;
+    margin-right: auto;
+}
 
 input[type="submit"] {
     margin-left: 40%;
@@ -116,10 +119,6 @@ input[type="submit"]:hover {
         padding-top: 0;
     }
 
-    .marketing-consent {
-        padding-left: 0;
-    }
-
     .submit-button {
         margin-left: 0;
         width: 100%;
@@ -127,9 +126,6 @@ input[type="submit"]:hover {
 }
 
 @media (max-width: 400px) {
-    .container.recaptcha {
-        margin-left: -12vw;
-    }
 }
 
 /*# sourceMappingURL=core_contact.bundle.css.map*/
\ No newline at end of file