now the contact text field is functional and send the emails

yosbelm · Jun 17, 2024 · 74fc5e8 · 74fc5e8
1 parent 2f29aee
commit 74fc5e8
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 7 deletions.
diff --git a/src/Contact/Contact.jsx b/src/Contact/Contact.jsx
@@ -50,19 +50,19 @@ export const ContactMe = () => {
 
                 </div>
             </div>
-            <form action={() => 'mailto:[email protected]'} className={styles.mailContainer} method="post" enctype="text/plain">
+            <form action={"https://formspree.io/f/xoqggrow"} className={styles.mailContainer} method="post" /*enctype="text/plain"*/>
                 <div className={styles.emailFieldNotButton}>
                     <div className={styles.emailFieldTextDiv}>
-                        <label htmlFor="name" hidden>Name</label>
-                        <input className={styles.emailFieldText} type="text" placeholder='Name' required/>
+                        <label for="name" hidden>Name</label>
+                        <input className={styles.emailFieldText} type="text" id='name' name='name' placeholder='Name' required/>
                     </div>
                     <div className={styles.emailFieldEmailDiv}>
-                        <label htmlFor="email" hidden>Email</label>
-                        <input className={styles.emailFieldEmail} type="email" placeholder='Email' required/>
+                        <label for="email" hidden>Email</label>
+                        <input className={styles.emailFieldEmail} type="email" id='email' name='email' placeholder='Email' required/>
                     </div>
                     <div className={styles.emailFieldMessageDiv}>
-                        <label htmlFor="message" hidden>Message</label>
-                        <textarea className={styles.emailFieldMessage} type="text" placeholder='Message' required></textarea>
+                        <label for="message" hidden>Message</label>
+                        <textarea className={styles.emailFieldMessage} type="text" id='message' name='message' placeholder='Message' required></textarea>
                     </div>
                 </div>
                 <div className={styles.emailSubmit}>

diff --git a/src/Contact/ContactStyles.module.css b/src/Contact/ContactStyles.module.css
@@ -164,18 +164,21 @@
 }
 :global(#dark) .emailFieldText{
     background-color: rgb(43, 41, 41);
+    color: white;
 }
 :global(#dark) .emailFieldText::placeholder{
     color: white;
 }
 :global(#dark) .emailFieldEmail{
     background-color: rgb(43, 41, 41);
+    color: white;
 }
 :global(#dark) .emailFieldEmail::placeholder{
     color: white;
 }
 :global(#dark) .emailFieldMessage{
     background-color: rgb(43, 41, 41);
+    color: white;
 }
 :global(#dark) .emailFieldMessage::placeholder{
     color: white;