update App.js

src/App.js

@@ -94,6 +94,7 @@ import CurrentDateShamsi from "./components/CurrentDateShamsi";
 import DateTime from "./components/DateTime";
 import CardDesign3 from "./components/CardDesign3";
 import CustomToast2 from "./components/CustomToast2";
+import ContactUsInfoCard from "./components/ContactUsInfoCard";
 
 function App() {
   return (
@@ -146,7 +147,8 @@ function App() {
         {/* <DistributedData /> */}
         {/* <CardDesign1 /> */}
         {/* <CardDesign2 /> */}
-        <CardDesign3 />
+        {/* <CardDesign3 /> */}
+        <ContactUsInfoCard />
         {/* <LeafletMap /> */}
 
         {/* *************************************************** mini components ***************************************************  */}

src/components/ContactUsInfoCard/images/logo-rectangle.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="155" height="144" viewBox="0 0 155 144">
+  <rect id="Rectangle_702" data-name="Rectangle 702" width="155" height="144" fill="#f5f5f5"/>
+</svg>

src/components/ContactUsInfoCard/images/marker.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+  <g id="vuesax_linear_location-tick" data-name="vuesax/linear/location-tick" transform="translate(-236 -188)">
+    <g id="location-tick">
+      <path id="Vector" d="M.243,6.49c1.97-8.66,14.8-8.65,16.76.01,1.15,5.08-2.01,9.38-4.78,12.04a5.193,5.193,0,0,1-7.21,0C2.253,15.88-.907,11.57.243,6.49Z" transform="translate(239.377 190)" fill="none" stroke="#2483e1" stroke-width="1.5"/>
+      <path id="Vector-2" data-name="Vector" d="M0,2.5,1.5,4l4-4" transform="translate(245.25 197)" fill="none" stroke="#2483e1" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+      <path id="Vector-3" data-name="Vector" d="M0,0H24V24H0Z" transform="translate(260 212) rotate(180)" fill="none" opacity="0"/>
+    </g>
+  </g>
+</svg>

src/components/ContactUsInfoCard/images/phone.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+  <g id="vuesax_linear_call-calling" data-name="vuesax/linear/call-calling" transform="translate(-172 -188)">
+    <g id="call-calling">
+      <g id="call-calling-2" data-name="call-calling">
+        <path id="Vector" d="M19.97,16.33a2.545,2.545,0,0,1-.25,1.09,4.126,4.126,0,0,1-.68,1.02,4.508,4.508,0,0,1-1.64,1.18,5.022,5.022,0,0,1-1.95.38,8.334,8.334,0,0,1-3.26-.73,17.564,17.564,0,0,1-3.44-1.98,28.75,28.75,0,0,1-3.28-2.8,28.414,28.414,0,0,1-2.79-3.27A17.828,17.828,0,0,1,.72,7.81,8.423,8.423,0,0,1,0,4.54,5.173,5.173,0,0,1,.36,2.61,4.6,4.6,0,0,1,1.51.94,2.93,2.93,0,0,1,3.59,0,1.879,1.879,0,0,1,4.4.18a1.63,1.63,0,0,1,.67.56L7.39,4.01a3.422,3.422,0,0,1,.4.7,1.581,1.581,0,0,1,.14.61,1.357,1.357,0,0,1-.21.71,3.4,3.4,0,0,1-.56.71l-.76.79a.535.535,0,0,0-.16.4.908.908,0,0,0,.03.23c.03.08.06.14.08.2a8.3,8.3,0,0,0,.93,1.28c.45.52.93,1.05,1.45,1.58.54.53,1.06,1.02,1.59,1.47a7.675,7.675,0,0,0,1.29.92c.05.02.11.05.18.08a.69.69,0,0,0,.25.04.55.55,0,0,0,.41-.17l.76-.75a3.068,3.068,0,0,1,.72-.56,1.332,1.332,0,0,1,.71-.21,1.6,1.6,0,0,1,.61.13,3.868,3.868,0,0,1,.7.39l3.31,2.35a1.517,1.517,0,0,1,.55.64A2.052,2.052,0,0,1,19.97,16.33Z" transform="translate(174 190)" fill="none" stroke="#2483e1" stroke-width="1.5"/>
+        <path id="Vector-2" data-name="Vector" d="M3.5,3.5A3.965,3.965,0,0,0,2.33,1.23,3.416,3.416,0,0,0,0,0" transform="translate(187 193.5)" fill="none" stroke="#2483e1" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+        <path id="Vector-3" data-name="Vector" d="M7,7A7,7,0,0,0,0,0" transform="translate(187 190)" fill="none" stroke="#2483e1" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
+      </g>
+      <path id="Vector-4" data-name="Vector" d="M0,0H24V24H0Z" transform="translate(172 188)" fill="none" opacity="0"/>
+    </g>
+  </g>
+</svg>

src/components/ContactUsInfoCard/index.js

@@ -0,0 +1,7 @@
+import React from "react";
+
+const ContactUsInfoCard = () => {
+  return <div>ContactUsInfoCard</div>;
+};
+
+export default ContactUsInfoCard;