contacts

const Contact = () => {
    const form = useRef();

    const sendEmail = (e) => {
        e.preventDefault();

    emailjs.sendForm('service_8g86nib', 'template_j6x98cq', form.current, 'g0ZTHnULevuGgRARa')
      .then((result) => {
          console.log(result.text);
      }, (error) => {
          console.log(error.text);
      });
      e.target.reset()

    };
    return ( <>
         <section class="contact-hero">
            <div className='contact-title'>
           <h2>CONTACT US</h2>
           </div>
         </section>
         <section className="contact-body">
            <form ref={form} onSubmit={sendEmail}>
                <div className='input-group'>
                     <input type="text" id="name" required />
                     <label for="name">
                        <ion-icon class="contact-icon" name="person-circle-outline"></ion-icon>
                        Your Name
                        </label>
                </div>
                <div className='input-group'>
                     <input type="text" id="name" required />

                     <label for="email">
                        <ion-icon class="contact-icon" name="at-outline"></ion-icon>
                        Your Gmail
                        </label>
                </div>

                <div className='input-group'>
                     <textarea name="message" id="" cols="30" rows="10"></textarea>
                     <label for="message">
                        <ion-icon class="contact-icon" name="mail"></ion-icon>
                        Your Message</label>
                </div>
                <button type="submit">
                    <ion-icon class="contact-icon" name="paper-plane-outline"></ion-icon>
                    Submit
                    </button>
            </form>
         </section>
    </> );
}

export default Contact;