reza added blogs

src/components/VodProduct/index.js

@@ -13,7 +13,7 @@ import videoImage5 from "./videoImages/image-5.svg";
 import videoImage6 from "./videoImages/image-6.svg";
 
 import watermelon from "./watermelon.png";
-import video from "./danovin.mp4";
+// import video from "./danovin.mp4";
 import discountImg from "./discount.png";
 import heart from "./vuesax-linear-heart.svg";
 import YellowDotIcon from "./yellowDotIcon.svg";

src/redux/actions/blog.js

@@ -4,24 +4,8 @@ const blog = {
     (data = {}) =>
     async (dispatch) =>
       await proxy.get("public/blogList", data, { dispatch }),
-  // update:
+  info: (data) => async (dispatch) =>
-  //   (data = {}, data2 = {}) =>
+    await proxy.get("public/blogInfo", data, { dispatch }),
-  //   async (dispatch : Dispatch) => {
-  //     await proxy.put("blog/update", data);
-  //     await proxy.get("blog/list", data2, { dispatch });
-  //   },
-  // add:
-  //   (data = {}, data2 = {}) =>
-  //   async (dispatch : Dispatch) => {
-  //     await proxy.post("blog/add", data);
-  //     await proxy.get("blog/list", data2, { dispatch });
-  //   },
-  // del:
-  //   (data = {}, data2 = {}) =>
-  //   async (dispatch : Dispatch) => {
-  //     await proxy.delete("blog/delete", data);
-  //     await proxy.get("blog/list", data2, { dispatch });
-  //   },
 };
 
 export default blog;

src/redux/reducers/blog.js

@@ -4,19 +4,45 @@ const initialState = {
   loading: false,
   error: null,
   list: [],
+  info: null,
+  hashtags: [
+    {
+      title: "فناوری اطلاعات",
+      color: "#019BC3",
+    },
+    {
+      title: "سخت افزار",
+      color: "#7CC301",
+    },
+    {
+      title: "آموزشی",
+      color: "#C5B90C",
+    },
+    {
+      title: "فرهنگی",
+      color: "#C2684D",
+    },
+    {
+      title: "معرفی کتاب",
+      color: "#8B4DC2",
+    },
+    {
+      title: "مهارت آموزی",
+      color: "#780D6D",
+    },
+    {
+      title: "پیشرفت شخصی",
+      color: "#E63F15",
+    },
+  ],
 };
 export default function blog(state = initialState, action) {
   let { type, data } = action;
   switch (type) {
     case "public/blogList":
       return { ...state, loading: false, list: data, error: null };
-    // case "blog/update":
+    case "public/blogInfo":
-    //   return { ...state, loading: false, error: null };
+      return { ...state, loading: false, error: null, blog: data };
-    // case "blog/add":
-    //   return { ...state, loading: false, error: null };
-    // case "blog/delete":
-    //   return { ...state, loading: false, error: null };
-    /////////////
     case "blog/loading":
       return { ...state, loading: true };
     case "blog/error":

src/router.js

@@ -28,6 +28,7 @@ import Contact from "./views/Contact";
 import Dashboard from "./views/Dashboard";
 import FooterDesign1 from "./components/Footer";
 import Bugs from "./views/BugsAndProblems";
+import Blogs from "./views/Blogs";
 // import VideoTube from "./views/Home/VideoTube";
 
 function Router({
@@ -352,6 +353,23 @@ function Router({
                 />
               }
             />
+            <Route
+              path="/blogs"
+              exact
+              element={
+                <Blogs
+                  // headerOptions={{
+                  //   logo: true,
+                  //   hamburgerMenu: true,
+                  //   qr: true,
+                  //   title: false,
+                  //   back: false,
+                  //   shown: true,
+                  //   menu: false,
+                  // }}
+                />
+              }
+            />
             <Route path="/bugs" exact element={<Bugs />} />
             <Route
               path="*"

src/views/Blogs/arrow.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="31.486" height="19.692" viewBox="0 0 31.486 19.692">
+  <path id="Vector" d="M26.537,0,14.153,12.384,9.435,5.307,0,14.743" transform="translate(2.475 2.475)" fill="none" stroke="#5db916" stroke-linecap="round" stroke-linejoin="round" stroke-width="3.5"/>
+</svg>

src/views/Blogs/index.js

@@ -0,0 +1,109 @@
+import React, { useEffect } from "react";
+import { connect } from "react-redux";
+import { blog, publicApi } from "../../redux/actions";
+import { Carousel } from "@trendyol-js/react-carousel";
+
+import Hashtags from "./layouts/Hashtags";
+import Single from "./layouts/Single";
+import Join from "./layouts/Join";
+import New from "./layouts/New";
+import Header from "./layouts/Header";
+import Suggest from "./layouts/Suggest";
+import Target from "./layouts/Target";
+
+//assets
+import arrow from "../../assets/icons/dropdown-blue.svg";
+
+export const Blogs = ({ isMobile, getList, blogs, setHeaderOptions }) => {
+  useEffect(() => {
+    setHeaderOptions({ shown: true });
+    if (blogs.length === 0) {
+      getList();
+    }
+  }, []);
+  return (
+    <div className="flex flex-col lg:w-11/12 mx-auto lg:py-24">
+      <Hashtags />
+      <Single />
+      <Header title={"تازه‌ترین‌ها از وبلاگ"} />
+      <div className="w-full relative" style={{ direction: "ltr" }}>
+        {blogs.length > 0 && (
+          <Carousel
+            show={3}
+            slide={2}
+            swiping={true}
+            useArrowKeys={true}
+            transition={0.5}
+            rightArrow={
+              <img
+                className="absolute top-1/2 transform -rotate-90 -translate-y-1/2 cursor-pointer p-0"
+                src={arrow}
+                alt=""
+                // onClick={(e) => e.stopPropagation()}
+              />
+            }
+            leftArrow={
+              <img
+                className="absolute top-1/2 transform -translate-y-1/2  -translate-x-5 cursor-pointer rotate-90 p-2 -left-3"
+                src={arrow}
+                alt=""
+                // onClick={(e) => e.stopPropagation()}
+              />
+            }
+          >
+            {blogs.map((blog, index) => (
+              <New blog={blog} key={index} />
+            ))}
+          </Carousel>
+        )}
+      </div>
+      <Header title={"پیشنهاد سردبیر"} />
+      <div className="w-full relative" style={{ direction: "ltr" }}>
+        {blogs.length > 0 && (
+          <Carousel
+            show={4}
+            slide={2}
+            swiping={true}
+            useArrowKeys={true}
+            transition={0.5}
+            rightArrow={
+              <img
+                className="absolute top-1/2 transform -rotate-90 -translate-y-1/2 cursor-pointer p-0"
+                src={arrow}
+                alt=""
+                // onClick={(e) => e.stopPropagation()}
+              />
+            }
+            leftArrow={
+              <img
+                className="absolute top-1/2 transform -translate-y-1/2  -translate-x-5 cursor-pointer rotate-90 p-2 -left-3"
+                src={arrow}
+                alt=""
+                // onClick={(e) => e.stopPropagation()}
+              />
+            }
+          >
+            {blogs.map((blog, index) => (
+              <Suggest blog={blog} key={index} />
+            ))}
+          </Carousel>
+        )}
+      </div>
+      <Header title={"از دنیای آموزش"} />
+      <Target blogs={blogs?.slice(0,4)} />
+      <Join />
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({
+  isMobile: state.publicApi.isMobile,
+  blogs: state.blog.list,
+});
+
+const mapDispatchToProps = {
+  getList: blog.list,
+  setHeaderOptions: publicApi.setHeaderOptions,
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Blogs);

src/views/Blogs/layouts/Hashtags.js

@@ -0,0 +1,28 @@
+import React from "react";
+import { connect } from "react-redux";
+
+//assets
+import arrowIcon from "../arrow.svg";
+
+export const Hashtags = ({ hashtags }) => {
+  return (
+    <div className="flex py-3 px-2 rounded-full border-2 border-green-50 shadow-sm border-solid items-center w-full mb-7">
+      <img src={arrowIcon} alt="" className="w-7" />
+      <ul className="list-none flex justify-around items-center flex-1">
+        {hashtags.map((hashtag, index) => (
+          <li className="text-tiny font-semibold cursor-pointer" style={{ color: hashtag.color }}>
+            {"#" + " " + hashtag.title}
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({
+  hashtags: state.blog.hashtags,
+});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Hashtags);

src/views/Blogs/layouts/Header.js

@@ -0,0 +1,17 @@
+import React from "react";
+import { connect } from "react-redux";
+
+export const Header = ({ title, color }) => {
+  return (
+    <div className="flex w-full items-center gap-5 mt-12 mb-4">
+      <storng className="py-5 pr-5 pl-10 bg-gray2C text-white font-semibold text-lg">{title}</storng>
+      <span className="flex-1 h-px shadow-md bg-gray-300"></span>
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Header);

src/views/Blogs/layouts/Join.js

@@ -0,0 +1,53 @@
+import React from "react";
+import { connect } from "react-redux";
+
+//assets
+import picImage from "../pic.svg";
+
+export const Join = ({}) => {
+  return (
+    <div className="w-full h-72 border-2 border-solid border-gray-100 rounded-md flex mt-20">
+      <img
+        src={picImage}
+        alt=""
+        style={{ height: "115%", transform: "translateY(-15%)" }}
+      />
+      <div className="flex flex-col justify-center h-full mr-4">
+        <strong className="text-2xl bold">اینجا خبری از اسپم نیست!</strong>
+        <strong
+          className="text-7xl bold my-4 text-red-600"
+          style={{ fontSize: "clamp(30px, calc(100vw / 35), 45px)" }}
+        >
+          خبرنامه وبلاگ دانوین
+        </strong>
+        <p className="leading-7 text-gray70" style={{ maxWidth: 400 }}>
+          بهترین و آخرین اخبار علمی و آموزشی را در ایمیل خودتون دریافت کنید. هر
+          زمان هم که لازم نداشتید می تونید عضویت رو لغو کنید
+        </p>
+      </div>
+      <div className="flex flex-col flex-1 h-full justify-center items-center">
+        <form className="flex w-full flex-row-reverse rounded-md mt-3 overflow-hidden lg:w-11/12">
+          <input
+            type="text"
+            className="flex-1 text-left pl-6 font-normal text-tiny dark:bg-gray2077 placeholder:text-blue5F dark:text-white border-t border-b border-l border-gray-300 border-solid outline-none lg:text-base"
+            placeholder={"آدرس ایمیل شما"}
+          />
+          <button
+            className={
+              "py-3 w-3/12 lg:py-6 text-lg bg-yellow4 text-black border-none lg:font-semibold"
+            }
+            // onClick={setOff}
+          >
+            عضویت
+          </button>
+        </form>
+      </div>
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Join);

src/views/Blogs/layouts/New.js

@@ -0,0 +1,53 @@
+import React from "react";
+import { connect } from "react-redux";
+import { Link } from "react-router-dom";
+import Avatar from "../../../components/Avatar";
+
+export const New = ({ blog }) => {
+  return (
+    <Link
+      to={"blogs/" + blog?.id}
+      className="px-4 flex flex-col"
+      style={{ direction: "rtl" }}
+    >
+      <img
+        src={`https://dnvn.ir/api/v1/file/${blog?.fileIds}`}
+        alt=""
+        className="w-full rounded-md"
+        style={{ height: "calc(100vw / 12 * 11 / 3 / 16 * 9)" }}
+      />
+      <strong className="text-lg my-4 leading-7">{blog?.title}</strong>
+      <p className="text-tiny leading-6 mb-3">
+        هر نفسی که فرو می‌ بریم، مرگی را که مدام به ما دست‌ اندازی می‌کند پس
+        می‌زند در نهایت این مرگ{" "}
+      </p>
+      <div className="w-full flex justify-between">
+        <div className="flex">
+          <Avatar size={60} />
+          <div className="flex flex-col py-2 mr-2 justify-center">
+            <strong className="lg:text-tiny lg:font-black text-gray1">
+              {"نوشته از:" + " " + "کامران ایزدی"}
+            </strong>
+            <p className="lg:text-sm lg:font-semibold text-gray70 mt-2">
+              {"سردبیر بخش وبلاگ دانوین"}
+            </p>
+          </div>
+        </div>
+        <div className="flex flex-col i justify-center items-end">
+          <span className="lg:text-sm text-gray1 lg:font-black">
+            {"زمان مطالعه" + " " + "۳۰ دقیقه"}
+          </span>
+          <span className="mt-2 lg:text-sm text-gray1 lg:font-black">
+            {"1400/11/24"}
+          </span>
+        </div>
+      </div>
+    </Link>
+  );
+};
+
+const mapStateToProps = (state) => ({});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(New);

src/views/Blogs/layouts/Single.js

@@ -0,0 +1,60 @@
+import React from "react";
+import { connect } from "react-redux";
+import Avatar from "../../../components/Avatar";
+
+export const Single = ({ blog, isMobile }) => {
+  return (
+    <div className="flex flex-col lg:flex-row lg:gap-5">
+      <div
+        className="w-full lg:w-1/2 rounded-md overflow-hidden"
+        style={{
+          height: isMobile ? "" : "calc(100vh / 2)",
+          minHeight: isMobile ? "" : 300,
+        }}
+      >
+        <img
+          src={`https://dnvn.ir/api/v1/file/${blog?.fileIds}`}
+          alt=""
+          className="w-full h-full"
+        />
+      </div>
+      <div className="flex flex-col lg:w-1/2 lg:pt-5 justify-between">
+        <div className="flex flex-col">
+          <h1 className="lg:text-5xl font-bold leading-6">{blog?.title}</h1>
+          <p className="lg:text-tiny text-gray70 lg:w-4/5 lg:mt-6 lg:leading-7">
+            هر نفسی که فرو می‌ بریم، مرگی را که مدام به ما دست‌ اندازی می‌کند پس
+            می‌زند... در نهایت این مرگ است که باید پیروز شود، زیرا از هنگام تولد
+            بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش، با آن
+            بازی می کند. با این همه، ما تا آنجا که ممکن است، با علاقه فراوان{" "}
+          </p>
+        </div>
+        <div className="w-full flex justify-between">
+          <div className="flex">
+            <Avatar size={80} />
+            <div className="flex flex-col py-2 mr-2 justify-center">
+              <strong className="lg:text-xl lg:font-black text-gray1">
+                {"نوشته از:" + " " + "کامران ایزدی"}
+              </strong>
+              <p className="lg:text-tiny lg:font-semibold text-gray70 mt-3">
+                {"سردبیر بخش وبلاگ دانوین"}
+              </p>
+            </div>
+          </div>
+          <div className="flex flex-col i justify-center items-end">
+            <span className="lg:text-tiny text-gray1 lg:font-black">{"زمان مطالعه" + " " + "۳۰ دقیقه"}</span>
+            <span className="mt-3 lg:text-tiny text-gray1 lg:font-black">{'1400/11/24'}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({
+  blog: state.blog.list[0],
+  isMobile: state.publicApi.isMobile,
+});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Single);

src/views/Blogs/layouts/Suggest.js

@@ -0,0 +1,27 @@
+import React from "react";
+import { connect } from "react-redux";
+import { Link } from "react-router-dom";
+
+export const Suggest = ({ blog }) => {
+  return (
+    <Link
+      to={"blogs/" + blog?.id}
+      className="px-4 flex flex-col"
+      style={{ direction: "rtl" }}
+    >
+      <img
+        src={`https://dnvn.ir/api/v1/file/${blog?.fileIds}`}
+        alt=""
+        className="w-full rounded-md"
+        style={{ height: "calc(100vw / 12 * 11 / 3 / 21 * 9)" }}
+      />
+      <strong className="text-lg my-4 leading-7">{blog?.title}</strong>
+    </Link>
+  );
+};
+
+const mapStateToProps = (state) => ({});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Suggest);

src/views/Blogs/layouts/Target.js

@@ -0,0 +1,83 @@
+import React from "react";
+import { connect } from "react-redux";
+import { Link } from "react-router-dom";
+import Avatar from "../../../components/Avatar";
+
+export const Target = ({ blogs }) => {
+  const Large = ({ blog }) => {
+    return (
+      <Link
+        to={"/blogs/" + blog?.id}
+        className="lg:w-1/2 relative rounded-md overflow-hidden"
+        style={{ height: "calc(100vw / 12  * 11 / 2 * 9 / 14)" }}
+      >
+        <img
+          src={`https://dnvn.ir/api/v1/file/${blog?.fileIds}`}
+          alt=""
+          className="w-full h-full absolute left-0 top-0"
+        />
+        <div className="w-full h-full from-black z-10 absolute left-0 top-0 bg-gradient-to-t flex flex-col justify-end pb-5 px-5">
+          <strong className="lg:text-3xl bold mb-7 leading-7 text-white">
+            {blog?.title}
+          </strong>
+          <div className="w-full flex justify-between">
+            <div className="flex">
+              <Avatar size={60} />
+              <div className="flex flex-col py-2 mr-2 justify-center">
+                <strong className="lg:text-tiny lg:font-black text-opacity-75  text-white">
+                  {"نوشته از:" + " " + "کامران ایزدی"}
+                </strong>
+                <p className="lg:text-sm lg:font-semibold text-white text-opacity-75 mt-2">
+                  {"سردبیر بخش وبلاگ دانوین"}
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </Link>
+    );
+  };
+
+  const Small = ({ blogs }) => {
+    return (
+      <div className="lg:w-1/2 flex flex-col justify-between">
+        {blogs.map((blog, index) => (
+          <Link
+            to={"/blogs/" + blog.id}
+            key={index}
+            className="lg:flex gap-4 w-full"
+          >
+            <img
+              src={`https://dnvn.ir/api/v1/file/${blog?.fileIds}`}
+              alt=""
+              style={{
+                height: "calc(100vw / 12  * 11 / 2 * 9 / 14 / 3.4)",
+                width: "calc(100vw / 12  * 11 / 2 * 9 / 14 / 3 * 16 / 10)",
+              }}
+              className="rounded-md"
+            />
+            <div className="flex flex-col justify-center">
+              <strong className="lg:font-bold lg:text-lg">{blog?.title}</strong>
+              <p className="lg:w-4/5 text-gray70 mt-3 leading-6">
+                هر نفسی که فرو می‌ بریم، مرگی را که مدام به ما دست‌ اندازی
+                می‌کند پس می‌زند در نهایت این مرگ{" "}
+              </p>
+            </div>
+          </Link>
+        ))}
+      </div>
+    );
+  };
+  return (
+    <div className="flex lg:flex-row gap-10">
+      <Large blog={blogs[0]} />
+      <Small blogs={blogs?.slice(0, 3)} />
+    </div>
+  );
+};
+
+const mapStateToProps = (state) => ({});
+
+const mapDispatchToProps = {};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Target);

src/views/Blogs/pic.svg

@@ -0,0 +1,108 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="322.724" height="276.413" viewBox="0 0 322.724 276.413">
+  <g id="Group_2000" data-name="Group 2000" transform="translate(-1393.629 -2552.012)">
+    <g id="Email_capture-bro" data-name="Email capture-bro" transform="translate(1386.035 2546.576)">
+      <g id="freepik--background-simple--inject-2" transform="translate(118 57.317)">
+        <path id="Path_13" data-name="Path 13" d="M68.4,195.295c-4.434-32.309,17.043-74.036,39.306-90.671C147.9,74.6,181.3,82.24,207.272,94.8s29.684,50.773,47.617,68.789,39.578,45.86,12.368,67.7-60.6,4.914-89.051,2.184-66.17,7.1-86.577-3.822C77.381,222,70.381,209.577,68.4,195.295Z" transform="translate(-67.816 -83.731)" fill="#92e3a9"/>
+        <path id="Path_14" data-name="Path 14" d="M68.4,195.295c-4.434-32.309,17.043-74.036,39.306-90.671C147.9,74.6,181.3,82.24,207.272,94.8s29.684,50.773,47.617,68.789,39.578,45.86,12.368,67.7-60.6,4.914-89.051,2.184-66.17,7.1-86.577-3.822C77.381,222,70.381,209.577,68.4,195.295Z" transform="translate(-67.816 -83.731)" fill="#fff" opacity="0.7"/>
+      </g>
+      <g id="freepik--Shadow--inject-2" transform="translate(202.889 253.473)">
+        <ellipse id="Ellipse_51" data-name="Ellipse 51" cx="58.434" cy="14.188" rx="58.434" ry="14.188" fill="#92e3a9"/>
+        <ellipse id="Ellipse_52" data-name="Ellipse 52" cx="58.434" cy="14.188" rx="58.434" ry="14.188" fill="#fff" opacity="0.5"/>
+      </g>
+      <g id="freepik--Plants--inject-2" transform="translate(85.77 193.158)">
+        <path id="Path_15" data-name="Path 15" d="M321.053,258.063s.314-1.685.349-1.789c.389-1.2,1.847-3.3,3.264-3.294a1.679,1.679,0,0,1,1.615,1.905,3.487,3.487,0,0,1-1.806,2.324A11.839,11.839,0,0,1,321.053,258.063Z" transform="translate(-287.473 -246.652)" fill="#92e3a9"/>
+        <path id="Path_16" data-name="Path 16" d="M296.723,242.152c1.33.482,2,2.945,1.952,4.211,0,.11-.256,1.807-.279,1.795h0c.1.389.215.807.331,1.266.2.848.418,1.812.581,2.869a28.722,28.722,0,0,1,.378,3.456,21.449,21.449,0,0,1-.128,3.88v.046c.174-.378.7-1.411.749-1.487.691-1.057,2.655-2.689,4.02-2.324a1.673,1.673,0,0,1,.993,2.26,3.513,3.513,0,0,1-2.358,1.772,11.629,11.629,0,0,1-3.485-.081,30.369,30.369,0,0,1-.842,3.869c-.209.738-.441,1.481-.685,2.219.157-.319.308-.581.331-.645.691-1.057,2.655-2.7,4.02-2.324a1.684,1.684,0,0,1,1.051,2.265,3.513,3.513,0,0,1-2.358,1.772,11.257,11.257,0,0,1-3.387-.07c-.1.285-.192.581-.29.848-.465,1.353-.935,2.7-1.359,4.066-.151.471-.279.941-.412,1.412.145-.285.267-.523.29-.581.691-1.057,2.655-2.7,4.02-2.324a1.673,1.673,0,0,1,1.051,2.26,3.36,3.36,0,0,1-2.358,1.743,11.364,11.364,0,0,1-3.294-.052c-.122.482-.244.97-.337,1.446-.058.325-.134.633-.174.964l-.139.97c-.064.616-.134,1.255-.18,1.859-.035.424-.058.825-.087,1.226.139-.47.442-1.382.476-1.458a6.517,6.517,0,0,1,2.167-2.463,1.956,1.956,0,0,1,.18-.325,1.673,1.673,0,0,1,2.463-.383c1.075.924.807,3.485.314,4.647,0,.07-.43.778-.685,1.22.192-.238.372-.47.581-.714.395-.476.8-.947,1.237-1.452.215-.238.436-.482.662-.72s.476-.476.714-.72c.581-.546,1.162-1.075,1.783-1.592a10.978,10.978,0,0,1-2.323-2.44,3.505,3.505,0,0,1-.285-2.933A1.679,1.679,0,0,1,304,270.65c1.2.755,1.324,3.305,1.011,4.531,0,.076-.343.929-.529,1.394.378-.308.749-.616,1.133-.918,1.121-.865,2.283-1.708,3.433-2.55l1.057-.778a11.648,11.648,0,0,1-2.416-2.521,3.425,3.425,0,0,1-.285-2.9,1.667,1.667,0,0,1,2.376-.749c1.2.749,1.319,3.3,1.011,4.525,0,.093-.488,1.324-.622,1.632.767-.581,1.534-1.162,2.26-1.743a28.708,28.708,0,0,0,2.806-2.608,11.794,11.794,0,0,1-2.434-2.527,3.5,3.5,0,0,1-.285-2.933,1.679,1.679,0,0,1,2.376-.755c1.2.755,1.324,3.305,1.011,4.531,0,.081-.372,1.016-.552,1.458l.07.041a21.349,21.349,0,0,0,2.323-3.084c.378-.581.7-1.191,1.011-1.777a11.3,11.3,0,0,1-2.626-2.2,3.387,3.387,0,0,1-.581-2.9,1.673,1.673,0,0,1,2.277-1.011c1.278.616,1.673,3.143,1.5,4.391,0,.07-.18.749-.314,1.243.134-.261.279-.534.4-.79.465-.964.831-1.876,1.162-2.689.18-.459.331-.883.471-1.278a11.114,11.114,0,0,1-1.307-3.148,3.47,3.47,0,0,1,.79-2.841,1.685,1.685,0,0,1,2.492.151c.842,1.162.035,3.561-.7,4.589-.058.093-1.208,1.371-1.226,1.348h0c-.128.383-.261.79-.424,1.237-.3.819-.651,1.743-1.1,2.718a30.05,30.05,0,0,1-1.586,3.084,21.873,21.873,0,0,1-2.254,3.166l-.035.035c.354-.215,1.365-.79,1.446-.825,1.162-.5,3.7-.784,4.647.285a1.673,1.673,0,0,1-.372,2.469,3.487,3.487,0,0,1-2.939.174,11.559,11.559,0,0,1-2.87-1.992,29.047,29.047,0,0,1-2.835,2.765c-.581.5-1.162.988-1.795,1.47l.633-.354c1.162-.5,3.7-.778,4.647.29a1.667,1.667,0,0,1-.372,2.463,3.488,3.488,0,0,1-2.939.18,11.187,11.187,0,0,1-2.794-1.929l-.7.552c-1.162.865-2.277,1.743-3.369,2.614-.383.308-.749.627-1.115.947.273-.157.511-.29.546-.3,1.162-.5,3.7-.784,4.647.285a1.673,1.673,0,0,1-.366,2.463,3.5,3.5,0,0,1-2.945.18,10.319,10.319,0,0,1-2.718-1.865c-.372.337-.738.68-1.08,1.022-.227.238-.459.453-.674.709l-.651.732c-.395.482-.807.976-1.162,1.452-.261.331-.505.651-.749.976.378-.314,1.133-.912,1.2-.958,1.069-.668,3.537-1.33,4.618-.418a1.684,1.684,0,0,1,0,2.5,3.546,3.546,0,0,1-2.9.622,11.057,11.057,0,0,1-3.113-1.528c-.407.534-.8,1.063-1.162,1.563-1.255,1.743-2.231,3.218-2.9,4.264l-.07.11-.865-.424c.046-.064.087-.134.139-.2.7-1.046,1.714-2.527,3.015-4.246.412-.546.86-1.121,1.33-1.7a17.932,17.932,0,0,1-1.348-1.667,12.292,12.292,0,0,1-3.334.407c-.041.668-.081,1.319-.1,1.934-.087,2.138-.081,3.915-.058,5.158v.145l-.953-.459c0-1.237.046-2.9.174-4.885.041-.68.1-1.406.168-2.149a11.6,11.6,0,0,1-3.235-1.272,3.389,3.389,0,0,1-1.487-2.544,1.679,1.679,0,0,1,1.847-1.679c1.4.18,2.579,2.445,2.811,3.689,0,.076.07.883.1,1.4.029-.308.058-.581.087-.912.064-.622.145-1.237.227-1.9l.157-.964c.047-.325.139-.662.2-.993.168-.767.383-1.539.581-2.323a11.2,11.2,0,0,1-3.288-.755,3.447,3.447,0,0,1-1.853-2.289,1.673,1.673,0,0,1,1.568-1.94c1.417-.035,2.9,2.027,3.34,3.218,0,.076.227.964.331,1.458.139-.465.279-.929.436-1.394.459-1.336.958-2.678,1.458-4.02.151-.407.3-.819.447-1.231a11.108,11.108,0,0,1-3.4-.767,3.475,3.475,0,0,1-1.859-2.289,1.679,1.679,0,0,1,1.568-1.94c1.417-.035,2.9,2.027,3.34,3.218.035.093.325,1.377.383,1.7.325-.9.639-1.807.918-2.713a29.781,29.781,0,0,0,.9-3.718,11.506,11.506,0,0,1-3.427-.773,3.45,3.45,0,0,1-1.853-2.289,1.673,1.673,0,0,1,1.568-1.94c1.412-.035,2.9,2.027,3.34,3.224,0,.076.244,1.051.343,1.516h.081a22.4,22.4,0,0,0,.215-3.845,19.166,19.166,0,0,0-.139-2.039,11.6,11.6,0,0,1-3.4-.389,3.44,3.44,0,0,1-2.1-2.068,1.685,1.685,0,0,1,1.348-2.1c1.4-.192,3.125,1.7,3.671,2.835.029.064.261.726.424,1.214-.035-.3-.064-.581-.1-.883-.145-1.063-.343-2.027-.523-2.875-.1-.488-.215-.924-.314-1.324a11.319,11.319,0,0,1-2.829-1.911,3.417,3.417,0,0,1-.906-2.806,1.679,1.679,0,0,1,2.108-1.266Z" transform="translate(-265.885 -242.086)" fill="#92e3a9"/>
+        <path id="Path_17" data-name="Path 17" d="M288.532,277.108a12.223,12.223,0,0,1-3.323-1.162s1.191-1.226,1.278-1.3c.988-.79,3.363-1.743,4.542-.947a1.673,1.673,0,0,1,.29,2.475A3.565,3.565,0,0,1,288.532,277.108Z" transform="translate(-232.094 -255.212)" fill="#92e3a9"/>
+        <g id="Group_128" data-name="Group 128" transform="translate(23.037)" opacity="0.5">
+          <path id="Path_18" data-name="Path 18" d="M321.053,258.063s.314-1.685.349-1.789c.389-1.2,1.847-3.3,3.264-3.294a1.679,1.679,0,0,1,1.615,1.905,3.487,3.487,0,0,1-1.806,2.324A11.839,11.839,0,0,1,321.053,258.063Z" transform="translate(-310.51 -246.652)" fill="#fff"/>
+          <path id="Path_19" data-name="Path 19" d="M296.723,242.152c1.33.482,2,2.945,1.952,4.211,0,.11-.256,1.807-.279,1.795h0c.1.389.215.807.331,1.266.2.848.418,1.812.581,2.869a28.722,28.722,0,0,1,.378,3.456,21.449,21.449,0,0,1-.128,3.88v.046c.174-.378.7-1.411.749-1.487.691-1.057,2.655-2.689,4.02-2.324a1.673,1.673,0,0,1,.993,2.26,3.513,3.513,0,0,1-2.358,1.772,11.629,11.629,0,0,1-3.485-.081,30.369,30.369,0,0,1-.842,3.869c-.209.738-.441,1.481-.685,2.219.157-.319.308-.581.331-.645.691-1.057,2.655-2.7,4.02-2.324a1.684,1.684,0,0,1,1.051,2.265,3.513,3.513,0,0,1-2.358,1.772,11.257,11.257,0,0,1-3.387-.07c-.1.285-.192.581-.29.848-.465,1.353-.935,2.7-1.359,4.066-.151.471-.279.941-.412,1.412.145-.285.267-.523.29-.581.691-1.057,2.655-2.7,4.02-2.324a1.673,1.673,0,0,1,1.051,2.26,3.36,3.36,0,0,1-2.358,1.743,11.364,11.364,0,0,1-3.294-.052c-.122.482-.244.97-.337,1.446-.058.325-.134.633-.174.964l-.139.97c-.064.616-.134,1.255-.18,1.859-.035.424-.058.825-.087,1.226.139-.47.442-1.382.476-1.458a6.517,6.517,0,0,1,2.167-2.463,1.956,1.956,0,0,1,.18-.325,1.673,1.673,0,0,1,2.463-.383c1.075.924.807,3.485.314,4.647,0,.07-.43.778-.685,1.22.192-.238.372-.47.581-.714.395-.476.8-.947,1.237-1.452.215-.238.436-.482.662-.72s.476-.476.714-.72c.581-.546,1.162-1.075,1.783-1.592a10.978,10.978,0,0,1-2.323-2.44,3.505,3.505,0,0,1-.285-2.933A1.679,1.679,0,0,1,304,270.65c1.2.755,1.324,3.305,1.011,4.531,0,.076-.343.929-.529,1.394.378-.308.749-.616,1.133-.918,1.121-.865,2.283-1.708,3.433-2.55l1.057-.778a11.648,11.648,0,0,1-2.416-2.521,3.425,3.425,0,0,1-.285-2.9,1.667,1.667,0,0,1,2.376-.749c1.2.749,1.319,3.3,1.011,4.525,0,.093-.488,1.324-.622,1.632.767-.581,1.534-1.162,2.26-1.743a28.708,28.708,0,0,0,2.806-2.608,11.794,11.794,0,0,1-2.434-2.527,3.5,3.5,0,0,1-.285-2.933,1.679,1.679,0,0,1,2.376-.755c1.2.755,1.324,3.305,1.011,4.531,0,.081-.372,1.016-.552,1.458l.07.041a21.349,21.349,0,0,0,2.323-3.084c.378-.581.7-1.191,1.011-1.777a11.3,11.3,0,0,1-2.626-2.2,3.387,3.387,0,0,1-.581-2.9,1.673,1.673,0,0,1,2.277-1.011c1.278.616,1.673,3.143,1.5,4.391,0,.07-.18.749-.314,1.243.134-.261.279-.534.4-.79.465-.964.831-1.876,1.162-2.689.18-.459.331-.883.471-1.278a11.114,11.114,0,0,1-1.307-3.148,3.47,3.47,0,0,1,.79-2.841,1.685,1.685,0,0,1,2.492.151c.842,1.162.035,3.561-.7,4.589-.058.093-1.208,1.371-1.226,1.348h0c-.128.383-.261.79-.424,1.237-.3.819-.651,1.743-1.1,2.718a30.05,30.05,0,0,1-1.586,3.084,21.873,21.873,0,0,1-2.254,3.166l-.035.035c.354-.215,1.365-.79,1.446-.825,1.162-.5,3.7-.784,4.647.285a1.673,1.673,0,0,1-.372,2.469,3.487,3.487,0,0,1-2.939.174,11.559,11.559,0,0,1-2.87-1.992,29.047,29.047,0,0,1-2.835,2.765c-.581.5-1.162.988-1.795,1.47l.633-.354c1.162-.5,3.7-.778,4.647.29a1.667,1.667,0,0,1-.372,2.463,3.488,3.488,0,0,1-2.939.18,11.187,11.187,0,0,1-2.794-1.929l-.7.552c-1.162.865-2.277,1.743-3.369,2.614-.383.308-.749.627-1.115.947.273-.157.511-.29.546-.3,1.162-.5,3.7-.784,4.647.285a1.673,1.673,0,0,1-.366,2.463,3.5,3.5,0,0,1-2.945.18,10.319,10.319,0,0,1-2.718-1.865c-.372.337-.738.68-1.08,1.022-.227.238-.459.453-.674.709l-.651.732c-.395.482-.807.976-1.162,1.452-.261.331-.505.651-.749.976.378-.314,1.133-.912,1.2-.958,1.069-.668,3.537-1.33,4.618-.418a1.684,1.684,0,0,1,0,2.5,3.546,3.546,0,0,1-2.9.622,11.057,11.057,0,0,1-3.113-1.528c-.407.534-.8,1.063-1.162,1.563-1.255,1.743-2.231,3.218-2.9,4.264l-.07.11-.865-.424c.046-.064.087-.134.139-.2.7-1.046,1.714-2.527,3.015-4.246.412-.546.86-1.121,1.33-1.7a17.932,17.932,0,0,1-1.348-1.667,12.292,12.292,0,0,1-3.334.407c-.041.668-.081,1.319-.1,1.934-.087,2.138-.081,3.915-.058,5.158v.145l-.953-.459c0-1.237.046-2.9.174-4.885.041-.68.1-1.406.168-2.149a11.6,11.6,0,0,1-3.235-1.272,3.389,3.389,0,0,1-1.487-2.544,1.679,1.679,0,0,1,1.847-1.679c1.4.18,2.579,2.445,2.811,3.689,0,.076.07.883.1,1.4.029-.308.058-.581.087-.912.064-.622.145-1.237.227-1.9l.157-.964c.047-.325.139-.662.2-.993.168-.767.383-1.539.581-2.323a11.2,11.2,0,0,1-3.288-.755,3.447,3.447,0,0,1-1.853-2.289,1.673,1.673,0,0,1,1.568-1.94c1.417-.035,2.9,2.027,3.34,3.218,0,.076.227.964.331,1.458.139-.465.279-.929.436-1.394.459-1.336.958-2.678,1.458-4.02.151-.407.3-.819.447-1.231a11.108,11.108,0,0,1-3.4-.767,3.475,3.475,0,0,1-1.859-2.289,1.679,1.679,0,0,1,1.568-1.94c1.417-.035,2.9,2.027,3.34,3.218.035.093.325,1.377.383,1.7.325-.9.639-1.807.918-2.713a29.781,29.781,0,0,0,.9-3.718,11.506,11.506,0,0,1-3.427-.773,3.45,3.45,0,0,1-1.853-2.289,1.673,1.673,0,0,1,1.568-1.94c1.412-.035,2.9,2.027,3.34,3.224,0,.076.244,1.051.343,1.516h.081a22.4,22.4,0,0,0,.215-3.845,19.166,19.166,0,0,0-.139-2.039,11.6,11.6,0,0,1-3.4-.389,3.44,3.44,0,0,1-2.1-2.068,1.685,1.685,0,0,1,1.348-2.1c1.4-.192,3.125,1.7,3.671,2.835.029.064.261.726.424,1.214-.035-.3-.064-.581-.1-.883-.145-1.063-.343-2.027-.523-2.875-.1-.488-.215-.924-.314-1.324a11.319,11.319,0,0,1-2.829-1.911,3.417,3.417,0,0,1-.906-2.806,1.679,1.679,0,0,1,2.108-1.266Z" transform="translate(-288.922 -242.086)" fill="#fff"/>
+          <path id="Path_20" data-name="Path 20" d="M288.532,277.108a12.223,12.223,0,0,1-3.323-1.162s1.191-1.226,1.278-1.3c.988-.79,3.363-1.743,4.542-.947a1.673,1.673,0,0,1,.29,2.475A3.565,3.565,0,0,1,288.532,277.108Z" transform="translate(-255.131 -255.212)" fill="#fff"/>
+        </g>
+        <path id="Path_21" data-name="Path 21" d="M320.422,316.29S313.713,300.1,309.966,300.8s6.442,25.808,6.442,25.808-11.815-22.288-19.872-22.288,2.957,24.635,13.157,32.843c0,0-16.108-17.357-25.506-13.6S303,344.91,303,344.91s-16.381-5.164-14.522-1.162,6.971,4.688,6.971,4.688l-18.524.941h64.46l-14.522-1.406s15.056-7.522,11.031-10.572-12.89,3.52-12.89,3.52,15.306-16.892,12.355-23.235-16.113,11.5-16.113,11.5,10.74-22.753,8.591-26.72S320.422,316.29,320.422,316.29Z" transform="translate(-276.92 -266.687)" fill="#92e3a9"/>
+        <path id="Path_22" data-name="Path 22" d="M320.422,316.29S313.713,300.1,309.966,300.8s6.442,25.808,6.442,25.808-11.815-22.288-19.872-22.288,2.957,24.635,13.157,32.843c0,0-16.108-17.357-25.506-13.6S303,344.91,303,344.91s-16.381-5.164-14.522-1.162,6.971,4.688,6.971,4.688l-18.524.941h64.46l-14.522-1.406s15.056-7.522,11.031-10.572-12.89,3.52-12.89,3.52,15.306-16.892,12.355-23.235-16.113,11.5-16.113,11.5,10.74-22.753,8.591-26.72S320.422,316.29,320.422,316.29Z" transform="translate(-276.92 -266.687)" fill="#fff" opacity="0.4"/>
+        <path id="Path_23" data-name="Path 23" d="M300.858,329c-5.908,17.426-5.908,29.8-5.908,29.8a24.584,24.584,0,0,0,14.231-5.1" transform="translate(-255.195 -278.514)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_24" data-name="Path 24" d="M319.193,334.086a104.389,104.389,0,0,0-4.833-15.306" transform="translate(-276.481 -274.231)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_25" data-name="Path 25" d="M295,327.56l15.039,22.288s10.177-8.591,13.662-13.43" transform="translate(-269.744 -277.911)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_26" data-name="Path 26" d="M341.288,366.645S325.442,359.129,319,354.83" transform="translate(-301.272 -289.34)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+      </g>
+      <g id="freepik--Character--inject-2" transform="translate(178.889 39.239)">
+        <path id="Path_27" data-name="Path 27" d="M195.1,270.339v14.9s-2.382,22.726-6.234,44.567l21.136,44.283-4.867.292s-32.589-40.276-33.733-44.576.765-36.828.765-36.828L138.929,313.04,124.6,363.489l-4.875-2s4.97-54.026,6.019-55.324c15.951-19.665,38.41-32.675,38.41-32.675l4.583-8.306Z" transform="translate(-82.78 -149.665)" fill="#263238" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <line id="Line_135" data-name="Line 135" x1="2.089" y1="11.006" transform="translate(86.735 133.048)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.5"/>
+        <line id="Line_136" data-name="Line 136" x1="4.936" y1="11.006" transform="translate(83.321 130.769)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.5"/>
+        <path id="Path_28" data-name="Path 28" d="M192,211.222s1.161,6.346-.516,7.8-7.636,2.382-8.315-.507,4.927-31.557,5.606-34.446,2.709-1.187,3.388-.335S192,211.222,192,211.222Z" transform="translate(-119.711 -138.073)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_29" data-name="Path 29" d="M150.927,203.648s18.642,7.515,24.4,10.078,2.7,8.315,1.84,10.318-14.687,37.834-15.031,38.479-2.58,2.2-5.778,2.193-21.875-4.635-22.546-6.879.525-5.77.525-5.77l9.751-29.837s-23.767,1.29-24.936,1.118-4.231-3.912-.653-7.464,25.985-9.6,27.172-10.619S148.889,202.961,150.927,203.648Z" transform="translate(-49.032 -141.016)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_31" data-name="Path 31" d="M185.423,211.519s3.053,0,4.067,6.286-.507,7.464-2.2,7.8-5.6,1.72-7.636-.335-2.21-6.621-1.023-10.181a5.391,5.391,0,0,1,6.793-3.568Z" transform="translate(-112.609 -142.11)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_32" data-name="Path 32" d="M149.016,203.87l-7.636,9.5,5.254-2.889,1.874,4.927Z" transform="translate(-40.414 -141.074)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_33" data-name="Path 33" d="M131.32,197.757l1.015,17.309,7.3-7.808,1.694-10.688Z" transform="translate(-24.077 -140.051)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_34" data-name="Path 34" d="M137.114,203.67l-8.753,8.091,2.218,7.137,8.057-9.287Z" transform="translate(-18.838 -141.046)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_35" data-name="Path 35" d="M195.39,247.325a58.772,58.772,0,0,0,32.967-9.975,52.555,52.555,0,0,0,23-35.607c4.643-29.588-17.06-57.654-48.445-62.65l-29.021-5.563L170.875,155.1l28.187,5.065.31.06c19.777,3.087,33.535,20.216,30.715,38.2s-21.118,30.018-40.809,27.026l-29.58-5.632-4.024,21.032,29.82,5.667.344.06a62.124,62.124,0,0,0,9.553.748Z" transform="translate(-155.672 -131.217)" fill="#263238" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_36" data-name="Path 36" d="M194.693,244.635a58.772,58.772,0,0,0,32.967-9.974,52.556,52.556,0,0,0,23-35.607c4.66-29.588-17.06-57.663-48.445-62.65L173.2,130.84l-2.975,21.574,28.187,5.065a1.939,1.939,0,0,0,.31.052c19.777,3.087,33.535,20.224,30.706,38.2s-21.11,30.018-40.809,27.026l-29.648-5.632L154.9,238.16l29.837,5.667.344.06A62.118,62.118,0,0,0,194.693,244.635Z" transform="translate(-154.313 -130.84)" fill="#92e3a9" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_37" data-name="Path 37" d="M167.93,256.249a55.891,55.891,0,0,0,26.983-9.355,52.064,52.064,0,0,0,13.87-13.663" transform="translate(-123.01 -145.188)" fill="#92e3a9" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_38" data-name="Path 38" d="M220.72,260.1c.86,0,1.789.069,2.683.069" transform="translate(-183.023 -148.953)" fill="#92e3a9" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_39" data-name="Path 39" d="M176.919,164.05a39.2,39.2,0,0,1,13.294,11.445,33.819,33.819,0,0,1,6.346,25.289,34.48,34.48,0,0,1-17.928,24.807" transform="translate(-118.895 -135.494)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_40" data-name="Path 40" d="M234.639,166.131a56.365,56.365,0,0,0-39.855-26.656l-26.432-5.065-2.261,16.423,26,4.669a43.45,43.45,0,0,1,6.827,1.66" transform="translate(-147.285 -131.34)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_41" data-name="Path 41" d="M163.94,178.487q-.774-1.883-1.72-3.7" transform="translate(-73.258 -136.999)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_42" data-name="Path 42" d="M241.672,156.43l-22.322-4.016,2.975-21.574L245,135.191Z" transform="translate(-203.442 -130.84)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_43" data-name="Path 43" d="M235.07,252.222l4.024-21.032,23.388,4.437-3.31,21.17Z" transform="translate(-234.442 -144.902)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_44" data-name="Path 44" d="M183.652,253.593s-31.342,1.806-32.89,1.548-6.4-5.443-7.618-6.019-3.68,1.212-5.159,1.8-2.726-.2-2.838,1,.765,1.66,2.459,1.574,2.709-.318,3.551-.361-1.771,1.8-4.041,3.955-4.093,2.932-3.534,3.921,1.909.748,2.726,0,3.182-.86,5.047-.946a17.7,17.7,0,0,0,5.013-1.616,123.571,123.571,0,0,0,13.208,2.365c9.588,1.367,23.113,3.379,26.837,3.01s6.174-5.417,6.174-5.417Z" transform="translate(-77.191 -147.399)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_45" data-name="Path 45" d="M130.456,215.4s5.039,1.961,6.4,4.85-.172,7.636-2.2,11.368-14.429,23.216-14.429,23.216l-7.464-6.784s6.784-21.376,7.636-23.217" transform="translate(-4.158 -142.689)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_46" data-name="Path 46" d="M128.426,223.6A7.292,7.292,0,0,0,123,225.463" transform="translate(-4.02 -143.835)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_47" data-name="Path 47" d="M134.949,221.83s-2.58.507-3.439,6.105" transform="translate(-17.861 -143.59)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_48" data-name="Path 48" d="M132.64,246.814s5.262,2.373,8.143,5.6,2.58,4.239.679,6.277-3.053,3.053-4.239,2.21-9.166-6.114-9.674-7.472,1.187-6.44,2.373-6.956A3.611,3.611,0,0,1,132.64,246.814Z" transform="translate(-22.344 -147.026)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_49" data-name="Path 49" d="M189.5,182.114s-5.262-4.918-5.942-7.3.86-6.105,1.359-6.277,1.015.86,1.015,2.21c0,0,1.531-1.866,1.72-.507a22.059,22.059,0,0,1,.163,2.373s1.531-1.72,1.866-.507a2.081,2.081,0,0,1-.679,2.038s2.21-1.72,2.21-.516a3.654,3.654,0,0,1-1.015,2.21s2.881,3.9,2.709,5.942a1.969,1.969,0,0,1-1.866,2.029" transform="translate(-120.439 -136.12)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_50" data-name="Path 50" d="M189.032,175.06s-1.187,1.187-1.015,2.2" transform="translate(-120.517 -137.037)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_51" data-name="Path 51" d="M190.7,173.28a7.358,7.358,0,0,0-1.359,3.053" transform="translate(-123.336 -136.787)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_52" data-name="Path 52" d="M192.869,171.11a7.369,7.369,0,0,0-1.359,3.56" transform="translate(-127.372 -136.483)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_53" data-name="Path 53" d="M128.559,392.132s-6.879,6.587-8.891,8.6-4.583,3.147-2.58,3.147,6.311.576,10.318-.568,7.171-4.592,8.6-6.311-2.58-5.159-2.58-5.159Z" transform="translate(-6.199 -167.414)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_54" data-name="Path 54" d="M117.857,402.739a26.57,26.57,0,0,0,10.852-.86c2.683-.86,5.882-5.159,7.094-6.879.507.86.739,1.72.2,2.4-1.427,1.72-4.583,5.159-8.6,6.311s-8.306.568-10.318.568C115.673,404.321,116.533,403.753,117.857,402.739Z" transform="translate(-6.195 -167.857)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_55" data-name="Path 55" d="M235.782,377.18s-15.478,6.587-16.621,6.879-1.376,2.115,3.964,2.115c2.3,0,10.946.568,12.95.568s4.3.181,4.867-.963-.284-6.6-.284-6.6Z" transform="translate(-198.842 -165.36)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_56" data-name="Path 56" d="M219.177,385.18h.043c6.655.98,18.625.817,21.918.748a2.665,2.665,0,0,1-.181.989c-.568,1.144-2.855.963-4.867.963s-10.654-.568-12.95-.568C217.8,387.3,218.034,385.464,219.177,385.18Z" transform="translate(-198.858 -166.481)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_57" data-name="Path 57" d="M140.144,213.08l-1.264,4.3,2.494-.851Z" transform="translate(-30.622 -142.364)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_58" data-name="Path 58" d="M129.616,169.764s1.023-3.053,5.262-3.4,11.883,5.77,12.563,10.018-5.606,15.607-7.472,17.3-17.645,1.2-18.152-1.015S126.228,176.213,129.616,169.764Z" transform="translate(-22.038 -135.817)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_59" data-name="Path 59" d="M146.854,182.36s-1.72,2.2-2.717,2.373-2.58-.172-1.72.86,3.732,1.72,3.732,1.72" transform="translate(-38.932 -138.059)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_60" data-name="Path 60" d="M136.69,191.126s3.732.86,5.426-1.866" transform="translate(-29.481 -139.026)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <line id="Line_137" data-name="Line 137" x2="1.531" y2="1.359" transform="translate(111.989 49.554)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_61" data-name="Path 61" d="M138.851,184.165a5.254,5.254,0,0,0-2.2-1.015" transform="translate(-26.182 -138.17)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_62" data-name="Path 62" d="M137.929,181s-1.015-1.522-4.239-.86" transform="translate(-22.715 -137.725)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_63" data-name="Path 63" d="M142.207,177.61s.172-2.58-2.21-2.382" transform="translate(-32.419 -137.059)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_64" data-name="Path 64" d="M143.74,180.588c-.275.6-.284,1.178,0,1.3s.679-.284.954-.86.275-1.178,0-1.29S144.006,179.96,143.74,180.588Z" transform="translate(-38.148 -137.689)" fill="#263238"/>
+        <path id="Path_65" data-name="Path 65" d="M128.624,185.29s-2.58-.679-2.58-2.038,1.023-1.72.679-2.717-2.717-2.373-2.038-3.9,4.076-1.522,3.732-2.709-11.7-4.076-12.554-7.636,2.889-7.98,5.77-7.808,1.359,3.732,1.359,3.732,8.487-2.58,10.181.679a3.34,3.34,0,0,1-1.531,4.755s5.942,2.709,6.449,6.784-6.612,11.875-8.143,12.382S128.624,185.29,128.624,185.29Z" transform="translate(-7.468 -134.712)" fill="#263238" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_66" data-name="Path 66" d="M119.56,176.8s4.867,3.362,5.538,6.019" transform="translate(2.266 -137.28)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.5"/>
+        <path id="Path_67" data-name="Path 67" d="M121.16,178.75s6.019,2.691,7.894,6.552" transform="translate(-3.065 -137.554)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.5"/>
+        <path id="Path_68" data-name="Path 68" d="M125.5,190.48s1.023-2.373,2.889-2.2,1.359,2.881-.507,5.09a2.631,2.631,0,0,1-4.248.172" transform="translate(-5.707 -138.888)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+      </g>
+      <g id="freepik--Emails--inject-2" transform="translate(8.286 6.1)">
+        <rect id="Rectangle_398" data-name="Rectangle 398" width="26.34" height="17.316" transform="translate(78.209 68.815)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_69" data-name="Path 69" d="M328.78,180.39l-13.17,8.653-13.17-8.653" transform="translate(-224.231 -111.575)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_399" data-name="Rectangle 399" width="26.34" height="17.316" transform="matrix(-0.969, 0.248, -0.248, -0.969, 52.141, 44.448)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_70" data-name="Path 70" d="M385.939,138.33,375.33,149.985l-14.91-5.123" transform="translate(-338.079 -110.638)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_400" data-name="Rectangle 400" width="26.34" height="17.316" transform="matrix(-0.969, 0.248, -0.248, -0.969, 67.116, 133.095)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_71" data-name="Path 71" d="M370.6,229l-10.618,11.655-14.9-5.123" transform="translate(-307.741 -112.657)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_401" data-name="Rectangle 401" width="26.34" height="17.316" transform="matrix(-0.969, 0.248, -0.248, -0.969, 39.067, 73.854)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_72" data-name="Path 72" d="M399.309,168.41,388.7,180.065l-14.91-5.114" transform="translate(-364.521 -111.308)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_402" data-name="Rectangle 402" width="26.34" height="17.316" transform="translate(63.413 84.412) rotate(129.8)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_73" data-name="Path 73" d="M374.986,185l-1.779,15.663-15.086,4.576" transform="translate(-324.877 -111.677)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_403" data-name="Rectangle 403" width="26.34" height="17.316" transform="translate(30.177 21.832) rotate(129.8)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_74" data-name="Path 74" d="M408.986,121l-1.779,15.663-15.086,4.576" transform="translate(-392.12 -110.252)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_404" data-name="Rectangle 404" width="26.183" height="17.212" transform="matrix(-0.805, -0.594, 0.594, -0.805, 25.725, 118.259)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.994"/>
+        <path id="Path_75" data-name="Path 75" d="M396.387,216.194l-15.732-.841L375.18,200.57" transform="translate(-362.958 -112.024)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_405" data-name="Rectangle 405" width="26.34" height="17.316" transform="translate(142.006 12.078)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_76" data-name="Path 76" d="M263.53,122.36l-13.17,8.653-13.17-8.653" transform="translate(-95.184 -110.282)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_406" data-name="Rectangle 406" width="26.34" height="17.316" transform="matrix(-0.724, 0.69, -0.69, -0.724, 147.605, 19.803)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_77" data-name="Path 77" d="M289.676,117.44l-3.569,15.35L270.6,135.606" transform="translate(-153.996 -110.173)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_407" data-name="Rectangle 407" width="26.34" height="17.316" transform="translate(64.33 26.86) rotate(-154.88)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_78" data-name="Path 78" d="M359.907,121.215l-15.595,2.249L336.06,110.04" transform="translate(-288.229 -110.008)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_408" data-name="Rectangle 408" width="26.34" height="17.316" transform="translate(100.846 5.64) rotate(76.02)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_79" data-name="Path 79" d="M311.57,120.06l11.586,10.687-5.221,14.871" transform="translate(-227.534 -110.231)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_409" data-name="Rectangle 409" width="26.34" height="17.316" transform="translate(159.632 135.165) rotate(-145.16)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_80" data-name="Path 80" d="M257.608,233.357l-15.751-.42L235.99,218.31" transform="translate(-88.089 -112.419)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_410" data-name="Rectangle 410" width="26.304" height="17.292" transform="matrix(-0.821, -0.571, 0.571, -0.821, 127.66, 138.621)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="0.999"/>
+        <path id="Path_81" data-name="Path 81" d="M290.828,236.727l-15.751-.42L269.21,221.68" transform="translate(-153.789 -112.494)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_411" data-name="Rectangle 411" width="26.34" height="17.316" transform="matrix(-0.889, 0.457, -0.457, -0.889, 170.603, 39.149)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_82" data-name="Path 82" d="M266.407,134.29l-7.763,13.718-15.663-1.682" transform="translate(-103.722 -110.548)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <rect id="Rectangle_412" data-name="Rectangle 412" width="26.34" height="17.316" transform="matrix(-0.889, 0.457, -0.457, -0.889, 160.235, 139.408)" fill="#fff" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+        <path id="Path_83" data-name="Path 83" d="M277.006,236.83l-7.763,13.727-15.673-1.682" transform="translate(-124.676 -112.832)" fill="none" stroke="#263238" stroke-linecap="round" stroke-linejoin="round" stroke-width="1"/>
+      </g>
+    </g>
+  </g>
+</svg>

tailwind.config.js

@@ -19,6 +19,7 @@ module.exports = {
       red19: "#C01919", // در صفحه محصول رنگ متن مشاهده نمونه
       yellow2: "#FDFFDA", // در انیمیشن موبایل که برای اسکن کد میاد نتیجه اسکن پس زمینه لینک ها
       yellow3: "#EFFF00", // خط زیر متن یادگیری در دیزاین موبایل پابلیک صفحه هوم
+      yellow4: "#FFEE00",
       gray36: "#52796f", // در حالت دارک صفحه موبایل پس زمینه دکمه های کیو آر و ای آز در هدر
       orange1: "#FF6600", // خط زیر متن کنارتونیم در دیزاین موبایل پابلیک صفحه هوم
       greenBA: "#06BAC0", // در سرچ اصلی سایت رنگ تکست تایتل محصولات و صفحات