Metrics Component Added

src/view/addProduct/Main/index.js

@@ -1,6 +1,7 @@
 import React from "react";
 import { Editor } from "react-draft-wysiwyg";
 import AddPic from "../components/addPic";
+import Metrics from "../components/metrics";
 import './editor.css';
 
 const MainAP = () => {
@@ -9,7 +10,7 @@ const MainAP = () => {
             <h1 className="text-blue3A text-lg font-bold w-full text-right px-4 mb-6 border-r-4 border-blue65">
                 اضافه کردن محصول جدید
             </h1>
-            <input type='text' className="w-full h-14 rtl px-4 bg-white border border-blueCD text-blue3A rounded-lg outline-none focus:shadow-md font-bold" placeholder="نام محصول" />
+            <input type='text' className="w-full h-14 rtl px-4 bg-white border border-blueCD text-blue3A rounded-lg outline-none  font-bold" placeholder="نام محصول" />
             <div className="w-full my-6 rtl text-right border border-grayE0 bg-white rounded-xl" >
                 <Editor
                     //   editorState={editorState}
@@ -21,6 +22,8 @@ const MainAP = () => {
             </div>
             <div className="flex justify-between w-full">
                 <AddPic />
+                <Metrics />
+                <Metrics />
             </div>
         </div>
     )

src/view/addProduct/components/addPic.js

@@ -13,7 +13,7 @@ const AddPic = () => {
         
       }, [selectedImage]);
     return(
-        <div className="w-2/5 bg-white border rounded-lg border-grayE0  flex flex-col py-6">
+        <div className="w-2/5 bg-white ml-2 border rounded-lg border-grayE0  flex flex-col py-6">
             <h1 className="text-blue3A text-lg font-bold w-full text-right px-4 mb-6 border-r-4 border-blue65">
                 تصویر شاخص / گالری
             </h1>

src/view/addProduct/components/metrics.js

@@ -0,0 +1,31 @@
+import React, {useState, useEffect} from "react";
+
+const Metrics = () => {
+   const inputs = [
+       'طول',
+       'عرض',
+       'ارتفاع',
+       'وزن',
+   ]
+    return(
+        <div className="w-1/3 bg-white border mx-2 rounded-lg border-grayE0  flex flex-col py-6">
+            <h1 className="text-blue3A text-lg font-bold w-full text-right px-4 mb-6 border-r-4 border-blue65">
+                وزن و ابعاد محصول
+            </h1>
+            <div className="flex flex-wrap">
+                {
+                    inputs.map(
+                        (item, index) => (
+                            <div className="w-1/2 p-4 py-2">
+                                <input type="number" placeholder={item} className="bg-white border border-grayE0 h-14 w-full outline-none px-2 rounded-md" />
+                            </div>    
+                        )
+                    )
+                }
+            </div>
+           
+        </div>
+    )
+}
+
+export default Metrics;