[react] Rage Clicks: detach 'Subscribe' button from form

sentry-demos · Aug 24, 2023 · 26e230e · 26e230e
1 parent d957308
commit 26e230e
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 11 deletions.
diff --git a/react/src/components/Footer.js b/react/src/components/Footer.js
@@ -12,21 +12,23 @@ class Footer extends Component {
       <footer id="footer">
         <div>
           <h2 className="h3 sentry-unmask">Sign up for plant tech news</h2>
-          <form>
-            <label htmlFor="email-subscribe" className="sentry-unmask">
-              Email
-            </label>
-            <input
-              type="email"
-              name="email-subscribe"
-              id="email-subscribe"
-            ></input>
+          <div class="formContainer">
+            <form>
+              <label htmlFor="email-subscribe" className="sentry-unmask">
+                Email
+              </label>
+              <input
+                type="email"
+                name="email-subscribe"
+                id="email-subscribe"
+              ></input>
+            </form>
             <input
               type="submit"
               value="Subscribe"
               className="sentry-unmask"
             ></input>
-          </form>
+          </div>
           <p className="sentry-unmask">
             © 2021 • Empower Plant • <Link to="/about">About us</Link>
           </p>

diff --git a/react/src/components/footer.css b/react/src/components/footer.css
@@ -16,9 +16,12 @@
   padding: 8rem 0 4rem;
 }
 
-#footer form {
+#footer .formContainer {
   width: 50%;
   margin: 0 auto;
+}
+
+#footer form {
   text-align: left;
 }