Contact Completed

src/view/contact/index.js

@@ -0,0 +1,89 @@
+import React from "react";
+import Button from "../../components/Button";
+import Input from "../../components/input";
+import Map from '../../components/Map'
+
+const ContactUs = () => {
+
+
+    const departments = [
+        {
+            title: 'انتخاب دپارتمان'
+        },
+        {
+            title: 'انتخاب دپارتمان'
+        },
+        {
+            title: 'انتخاب دپارتمان'
+        },
+        {
+            title: 'انتخاب دپارتمان'
+        },
+        {
+            title: 'انتخاب دپارتمان'
+        },
+        {
+            title: 'انتخاب دپارتمان'
+        },
+    ]
+
+    return (
+        <div className=" w-full text-right" style={{ direction: 'rtl', marginTop: '6.5%', paddingRight: '8.5%' }}>
+            <h1 className="w-2/3 border-b border-gray-300 text-3xl font-bold text-red52 py-4">تماس با ما</h1>
+            <div className="flex ">
+                <div className="w-1/3">
+
+                    <form className="flex flex-col w-full">
+                        <Input title='نام' gapSize='8' id={0} style={{ width: '50%' }} />
+                        <Input title='ایمیل' gapSize='8' id={1} style={{ width: '50%' }} />
+                        <select className="bg-white border border-solid border-gray-200 w-full my-4 p-3 rounded-lg text-gray-400 outline-red52">
+                            {departments.map((item, index) => (
+                                <option key={`Grade__${index}`}>{item.title}</option>
+                            ))}
+                        </select>
+                        <textarea className="w-full border-gray-200 border p-3 rounded-lg text-gray-400 outline-red52" rows='7' cols='70' placeholder="متن پیام را اینجا تایپ کنید">
+
+                        </textarea>
+                        <div className="w-full flex" style={{direction: 'ltr'}}>
+                                <Button title='ارسال پیام' className='w-32'/>
+                        </div>
+                    </form>
+                </div>
+                <div className="flex flex-col w-1/3 mr-32 mt-4">
+                    <div className="flex w-full justify-between mb-4 items-start">
+                        
+                            <div className="w-1/2 p-2">
+                                <h1 className="text-red52 text-xl p-1 pr-0 font-black">آدرس ما</h1>
+                                <p className="text-gray-400 text-sm">تهران خیابان انقلاب بین ابوریحان و فلسطین بن بست سروش پلاک  2</p>
+                            </div>
+                            <div className="w-1/2 p-2">
+                                <h1 className="text-red52 text-xl p-1 pr-0 font-black">شماره تماس</h1>
+                                <p className="text-gray-400 text-sm"> 02163462405 - 02163462406 </p>
+                            </div>
+                    
+                        
+                    </div>
+                    <div className="w-full flex justify-between mb-4 items-start">
+                        
+                    <div className="w-1/2 p-2">
+                                <h1 className="text-red52 text-xl p-1 pr-0 font-black"> شماره پیامک </h1>
+                                <p className="text-gray-400  text-sm">300000000008762144</p>
+                                <p className="text-gray-400 text-sm">توجه داشته باشید تمامی پیامک ها از سامانه آزمون از طریق همین سرشماره برای شما ارسال خواهد شد</p>
+                            </div>
+                            <div className="w-1/2 p-2">
+                                <h1 className="text-red52 text-xl p-1 pr-0 font-black"> ایمیل سازمانی </h1>
+                                <p className="text-gray-400 text-sm">Info@Azmoonsample.ir</p>
+                            </div>
+                    
+                        
+                    </div>
+                    <div className="w-1/2 overflow-hidden" style={{height:'400px'}}>
+                    <Map />
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default ContactUs;