Updates on contact page

src/component/Contact/Main.js

@@ -6,7 +6,7 @@ import Bredcrumb from "../Bredcrumb/Main";
 import BGImg from "../../assets/images/bread_crumb_bg.png";
 import BGImg1 from "../../assets/images/bread_crumb_bg_one.png";
 import BGImg2 from "../../assets/images/bread_crumb_bg_two.png";
-import axios from "axios";
+import SuccessImg from "../../assets/images/experts_01.png"
 
 import SiteService from "../../vendors/service/siteService";
 
@@ -100,7 +100,7 @@ const Main = ({ brdcum }) => {
           response.innerHTML = `<p> SEND MESSAGE </p>`;
 
           contact_body.innerHTML = `<div class='contact_body animate pop'>
-      <div><img /></div>
+      <div><img src=${SuccessImg} /></div>
       <p>We have received your message and will follow up promptly.</p>
       </div>`;
           setTimeout(() => {
@@ -240,12 +240,13 @@ const Main = ({ brdcum }) => {
 
                 <FormInput
                   name="phone"
-                  type="text"
+                  type="number"
                   placeholder="Phone"
                   errorMessage="It should be a valid phone number!"
                   maxLenght={15}
                   value={values.phone}
                   onChange={onChange}
+                  pattern="^[0-9]{15}$"
                 />
 
                 <div className="form-group">
@@ -254,8 +255,10 @@ const Main = ({ brdcum }) => {
                     className="form-control"
                     placeholder="Your message"
                     value={values.msg}
+                    errorMessage='words have exceeded 350 characters!'
                     onChange={onChange}
-                    maxLength={350}
+                    maxLength={300}
+                    pattern="^[A-Za-z0-9]{5, 300}$"
                   />
                 </div>
                 <div className="form-group term_check">