reza added some thing

3 years ago · 3d391f7497
parent 4be4ab6cdb
commit 3d391f7497
30 changed files with 359 additions and 174 deletions
--- a/public/index.html
+++ b/public/index.html
@ -3,35 +3,43 @@
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="false" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1"
+      user-scalable="false"
+    />
    <meta name="theme-color" content="#000000" />
    <meta name="description" content="فروشگاه کتاب دانوین" />
    <link
      href="https://api.mapbox.com/mapbox-gl-js/v1.10.1/mapbox-gl.css"
      rel="stylesheet"
    />
-    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="mobile-web-app-capable" content="yes" />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes" />
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

-    <title>Danovin</title>
+    <title>دانوین</title>
  </head>
  <body>
    <div id="root"></div>
-  <script>
-    if ('serviceWorker' in navigator) {
-      window.addEventListener('load', function () {
-        navigator.serviceWorker.register('./serviceworker.js')
-          .then((registration) => {
-            // Registration was successful
-            console.log('ServiceWorker registration successful with scope: ', registration.scope);
-          })
-          .catch((err) => {
-            console.log(err)
-          });
-      });
-    }
-  </script>
+    <script>
+      if ("serviceWorker" in navigator) {
+        window.addEventListener("load", function () {
+          navigator.serviceWorker
+            .register("./serviceworker.js")
+            .then((registration) => {
+              // Registration was successful
+              console.log(
+                "ServiceWorker registration successful with scope: ",
+                registration.scope
+              );
+            })
+            .catch((err) => {
+              console.log(err);
+            });
+        });
+      }
+    </script>
  </body>
 </html>
--- a/public/manifest.json
+++ b/public/manifest.json
@ -1,6 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "دانوین",
+  "name": "فروشگاه کتاب دانوین",
  "icons": [
    {
      "src": "favicon.ico",
--- a/src/AppRouter.js
+++ b/src/AppRouter.js
@ -43,12 +43,12 @@ class AppRouter extends Component {
    const mobile = window.innerWidth < 1000 ? true : false;
    let home = mobile ? (
      <Route exact path={"/"}>
-        {proxy.status ? (
-          this.props.profile ? (
+        {proxy.status() ? (
+          this.props.profile.status ? (
            <Home />
          ) : (
-            <Auth />
-            // <Auth page={"profile"} />
+            // <Auth />
+            <Auth page={"profile"} />
          )
        ) : (
          <Auth />
--- a/src/Redux/actions/activation.js
+++ b/src/Redux/actions/activation.js
@ -0,0 +1,26 @@
+import proxy from "../proxy";
+const activation = {
+  list:
+    (data = {}) =>
+    async (dispatch) =>
+      await proxy.get("activation/list", data, { dispatch }),
+  update:
+    (data = {}, data2 = {}) =>
+    async (dispatch) => {
+      await proxy.put("activation/update", data);
+      await proxy.get("activation/list", data2, { dispatch });
+    },
+  add:
+    (data = {}) =>
+    async (dispatch) => {
+      await proxy.post("activation/add", data);
+    },
+  del:
+    (data = {}, data2 = {}) =>
+    async (dispatch) => {
+      await proxy.delete("activation/delete", data);
+      await proxy.get("activation/list", data2, { dispatch });
+    },
+};
+
+export default activation;
--- a/src/Redux/actions/index.js
+++ b/src/Redux/actions/index.js
@ -10,3 +10,4 @@ export { default as userProduct } from "./userProduct.js";
 export { default as userFactor } from "./userFactor.js";
 export { default as transport } from "./transport.js";
 export { default as comment } from "./comment.js";
+export { default as activation } from "./activation.js";
--- a/src/Redux/actions/transport.js
+++ b/src/Redux/actions/transport.js
@ -20,6 +20,14 @@ const transport = {
      await proxy.post("transport/add", data);
      await proxy.get("transport/list", data2, { dispatch });
    },
+  setTransport:
+    (data = {}, data2 = {}, data3 = {}) =>
+    async (dispatch) => {
+      await proxy.post("transport/setTransport", data);
+      await proxy.get("userFactor/info", data3, { dispatch });
+      await proxy.get("transport/list", data2, { dispatch });
+      console.log(data);
+    },
  del:
    (data = {}, data2 = {}) =>
    async (dispatch) => {
--- a/src/Redux/reducers/activation.js
+++ b/src/Redux/reducers/activation.js
@ -0,0 +1,27 @@
+import { toast } from "react-toastify";
+
+const initialState = {
+  loading: false,
+  error: null,
+  list: [],
+};
+export default function activation(state = initialState, action) {
+  let { type, data } = action;
+  switch (type) {
+    case "activation/list":
+      return { ...state, loading: false, list: data, error: null };
+    case "activation/update":
+      return { ...state, loading: false, error: null };
+    case "activation/add":
+      toast.sucess("کتاب شما با موفقیت فعال گردید.");
+      return { ...state, loading: false, error: null };
+    case "activation/delete":
+      return { ...state, loading: false, error: null };
+    case "loading":
+      return { ...state, loading: true };
+    case "error":
+      return { ...state, loading: false, error: data.message };
+    default:
+      return state;
+  }
+}
--- a/src/Redux/reducers/index.js
+++ b/src/Redux/reducers/index.js
@ -10,3 +10,4 @@ export { default as userProduct } from "./userProduct.js";
 export { default as userFactor } from "./userFactor.js";
 export { default as transport } from "./transport.js";
 export { default as comment } from "./comment.js";
+export { default as activation } from "./activation.js";
--- a/src/Redux/reducers/transport.js
+++ b/src/Redux/reducers/transport.js
@ -1,3 +1,4 @@
+import { toast } from "react-toastify";
 const initialState = {
  loading: true,
  error: null,
@ -15,6 +16,9 @@ export default function transport(state = initialState, action) {
      return { ...state, loading: false, error: null };
    case "transport/add":
      return { ...state, loading: false, error: null };
+    case "transport/setTransport":
+      toast.success("روش ارسال با موفقیت تغییر یافت!");
+      return { ...state, loading: false, error: null };
    case "transport/delete":
      return { ...state, loading: false, error: null };
    case "loading":
--- a/src/assets/images/film.jpg
+++ b/src/assets/images/film.jpg
--- a/src/assets/images/music.jpg
+++ b/src/assets/images/music.jpg
--- a/src/views/Activation/index.js
+++ b/src/views/Activation/index.js
@ -1,12 +1,11 @@
 import React, { Component } from "react";
+import { connect } from "react-redux";
+import { activation } from "~/Redux/actions";
 import Navbar from "../Home/Navbar/index";
 import Footer from "../Home/Footer/index";
 import { Link } from "react-router-dom";
-import History from "./History/index";

-import sciense_6 from "../../assets/images/sciense-6.png";
 import analytics from "../../assets/icons/analytics.svg";
-import danger from "../../assets/icons/danger.svg";

 import "./index.scss";

@ -29,10 +28,15 @@ const fontSize = {
  },
 };

-export default class Activation extends Component {
+class Activation extends Component {
  state = {
    value: null,
  };
+
+  componentDidMount() {
+    this.props.add({});
+  }
+
  render() {
    const { data } = this.props;
    return (
@ -154,13 +158,4 @@ export default class Activation extends Component {
  }
 }

-Activation.defaultProps = {
-  data: [
-    {
-      title: "ریاضیات گسسته خیلی پیشرفته",
-      subTitle: "پایه هفتم ابتدایی",
-      status: "انجام شد",
-      image: sciense_6,
-    },
-  ],
-};
+export default connect((state) => ({}), { add: activation.add })(Activation);
--- a/src/views/Auth/Login/Cellphone/index.scss
+++ b/src/views/Auth/Login/Cellphone/index.scss
@ -21,6 +21,7 @@
      width: 100%;
      position: relative;
      padding: 10px 40px;
+      height: 130px;
      img {
        position: absolute;
        left: 50px;
@ -31,7 +32,7 @@
        text-align: right;
        position: absolute;
        left: 108px;
-        top: 18px;
+        top: 22px;
        direction: ltr;
        color: #a5a5a5;
        font-family: numeralLight;
@ -46,7 +47,7 @@
        text-align: left;
        background-color: #f2f2f2;
        border: none;
-        padding: 8px 5px 8px 85px;
+        padding: 8px 5px 8px 80px;
        border-radius: 5px;
        &:focus {
          outline: 0px;
@ -94,6 +95,7 @@
    margin-bottom: 30px;
    position: relative;
    bottom: 40px;
+    width: 250px;
  }
  h1 {
    font-family: numeralBold;
--- a/src/views/Auth/Login/Code/index.scss
+++ b/src/views/Auth/Login/Code/index.scss
@ -70,6 +70,7 @@
  img {
    margin-bottom: 30px;
    position: relative;
+    width: 250px;
  }
  h1 {
    width: 100%;
--- a/src/views/Auth/Login/index.js
+++ b/src/views/Auth/Login/index.js
@ -23,8 +23,8 @@ class Login extends Component {
      this.props.otp_login({
        cellphone,
        otp,
-        userToken: "1",
-        applicationToken: "11",
+        userToken: "2",
+        applicationToken: "22",
      });
  }

--- a/src/views/Blogs/BreadCrumb/index.js
+++ b/src/views/Blogs/BreadCrumb/index.js
@ -19,7 +19,7 @@ const fontSize = {

 export default function ActiveLastBreadcrumb() {
  return (
-    <Breadcrumbs aria-label="breadcrumb">
+    <Breadcrumbs aria-label="breadcrumb" style={{ marginBottom: 10 }}>
      <Link
        to={"/"}
        style={{
--- a/src/views/Blogs/BreadCrumb/index.scss
+++ b/src/views/Blogs/BreadCrumb/index.scss
@ -1,8 +1,8 @@
-.MuiBreadcrumbs-li{
+.MuiBreadcrumbs-li {
  a {
    text-decoration: none;
    font-family: numeralLight;
-    color: #6F7074;
+    color: #6f7074;
    letter-spacing: -1px;
  }
 }
--- a/src/views/Blogs/index.js
+++ b/src/views/Blogs/index.js
@ -8,6 +8,9 @@ import Footer from "../Home/Footer";
 import BreadCrumb from "./BreadCrumb/index";
 import Loader from "~/components/Loader/index";

+import music from "~/assets/images/music.jpg";
+import video from "~/assets/images/film.jpg";
+
 import "./index.scss";

 class Blogs extends Component {
@ -76,7 +79,18 @@ const Item = (props) => {
      {window.innerWidth > 1000 ? (
        <Link to={"/blogs/" + item.id} className="landscape-blogs-item d-flex">
          <div className="landscape-blogs-item__pic">
-            <img src={`https://dnvn.ir/api/v1/file/${item.id}`} alt={item.id} />
+            {item.type === "image" ? (
+              <img
+                src={`https://dnvn.ir/api/v1/file/${item.fileIds}`}
+                alt={item.title}
+              />
+            ) : null}
+            {item.type === "video" ? (
+              <img src={video} alt={item.title} />
+            ) : null}
+            {item.type === "audio" ? (
+              <img src={music} alt={item.title} />
+            ) : null}
          </div>
          <div className="landscape-blogs-item__left d-flex flex-column">
            <h1>{item.title}</h1>
@ -89,10 +103,14 @@ const Item = (props) => {
          to={"/blogs/" + item.id}
          className="portrait-blogs-item d-flex flex-column"
        >
-          <img
-            src={`https://dnvn.ir/api/v1/file/${item.id}`}
-            alt={item.title}
-          />
+          {item.type === "image" ? (
+            <img
+              src={`https://dnvn.ir/api/v1/file/${item.fileIds}`}
+              alt={item.title}
+            />
+          ) : null}
+          {item.type === "video" ? <img src={video} alt={item.title} /> : null}
+          {item.type === "audio" ? <img src={music} alt={item.title} /> : null}
          <h1>{item.title}</h1>
          {/* <p>{item.text}</p> */}
          <span>مطالعه کامل</span>
--- a/src/views/Blogs/index.scss
+++ b/src/views/Blogs/index.scss
@ -117,29 +117,33 @@
    position: relative;
    margin: 20px 4px 0px;
    transform: translateY(-10px);
-    height: 330px;
+    // height: 330px;
    & img {
      width: 100%;
      height: 220px;
      border-radius: 10px;
+      max-width: 300px;
+      margin: 0px auto;
    }
    h1 {
+      width: 100%;
      padding-right: 2px;
-      font-size: 28px;
-      margin-bottom: 0px;
-      margin-top: 10px;
+      font-size: 24px;
      // color: $smalt;
      text-decoration: none;
      color: #4e4e4e;
+      max-width: 300px;
+      text-align: right;
+      margin: 10px auto 0px;
    }
    span {
-      position: absolute;
-      font-size: 18px;
-      bottom: 5px;
-      left: 10px;
-      margin-bottom: 0px;
+      width: 100%;
+      max-width: 300px;
+      font-size: 14px;
+      margin: 10px auto 0px;
      border-radius: 10px;
      color: #6cbe44;
+      text-align: left;
    }
  }
 }
--- a/src/views/Cart/DeliveryMethod/index.js
+++ b/src/views/Cart/DeliveryMethod/index.js
@ -1,4 +1,7 @@
+import React, { Component } from "react";
 import "./index.scss";
+import { connect } from "react-redux";
+import { transport } from "~/Redux/actions";

 const maxDesktopSize = 1250;
 const maxMobileSize = 550;
@ -22,54 +25,66 @@ const fontSize = {
    input: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 20,
  },
 };
-const DeliveryMethod = (props) => {
-  return (
-    <>
-      {window.innerWidth > 1000 ? (
-        <div
-          className="delivery-methods d-flex justify-content-between align-items-center"
-          style={{
-            background: props.data.isDe ? "#ccffcc" : "white",
-          }}
-          onClick={() =>
-            props.parent.setState({ selectedDelivery: props.data })
-          }
-        >
-          <strong style={{ fontSize: fontSize.desktop.strong }}>
-            {props.data.name}
-          </strong>
-          <div className="d-flex flex-column align-items-center">
-            <h3 style={{ fontSize: fontSize.desktop.h3 }}>
-              {props.data.price}
-            </h3>
-            <span style={{ fontSize: fontSize.desktop.span }}>تومان</span>
+class DeliveryMethod extends Component {
+  render() {
+    const { data, setTransport, factorInfo, parent, transportId, list } =
+      this.props;
+    return (
+      <>
+        {window.innerWidth > 1000 ? (
+          <div
+            className="delivery-methods d-flex justify-content-between align-items-center"
+            style={{
+              background: data.isDe ? "#ccffcc" : "white",
+            }}
+            onClick={() => parent.setState({ selectedDelivery: data })}
+          >
+            <strong style={{ fontSize: fontSize.desktop.strong }}>
+              {data.name}
+            </strong>
+            <div className="d-flex flex-column align-items-center">
+              <h3 style={{ fontSize: fontSize.desktop.h3 }}>{data.price}</h3>
+              <span style={{ fontSize: fontSize.desktop.span }}>تومان</span>
+            </div>
          </div>
-        </div>
-      ) : null}
-      {window.innerWidth < 1000 ? (
-        <div
-          className="mobile-delivery-methods d-flex justify-content-between align-items-center"
-          style={{
-            background:
-              props.parent.state.selectedDelivery === props.data
-                ? "#ccffcc"
-                : "white",
-          }}
-          onClick={() =>
-            props.parent.setState({ selectedDelivery: props.data })
-          }
-        >
-          <strong style={{ fontSize: fontSize.mobile.strong }}>
-            {props.data.name}
-          </strong>
-          <div className="d-flex flex-column align-items-center">
-            <h3 style={{ fontSize: fontSize.mobile.h3 }}>{props.data.price}</h3>
-            <span style={{ fontSize: fontSize.mobile.span }}>تومان</span>
+        ) : null}
+        {window.innerWidth < 1000 ? (
+          <div
+            className="mobile-delivery-methods d-flex justify-content-between align-items-center"
+            style={{
+              background: data.id === transportId ? "#ccffcc" : "white",
+            }}
+            onClick={() =>
+              setTransport(
+                {
+                  factorId: factorInfo.id,
+                  transportId: data.id,
+                },
+                {},
+                { id: list[0].factorId }
+              )
+            }
+          >
+            <strong style={{ fontSize: fontSize.mobile.strong }}>
+              {data.name}
+            </strong>
+            <div className="d-flex flex-column align-items-center">
+              <h3 style={{ fontSize: fontSize.mobile.h3 }}>{data.price}</h3>
+              <span style={{ fontSize: fontSize.mobile.span }}>تومان</span>
+            </div>
          </div>
-        </div>
-      ) : null}
-    </>
-  );
-};
+        ) : null}
+      </>
+    );
+  }
+}

-export default DeliveryMethod;
+export default connect(
+  (state) => ({
+    factorInfo: state.userFactor.info,
+    list: state.userProduct.list,
+  }),
+  {
+    setTransport: transport.setTransport,
+  }
+)(DeliveryMethod);
--- a/src/views/Cart/Discount/index.js
+++ b/src/views/Cart/Discount/index.js
@ -38,6 +38,7 @@ const DiscoutCode = ({ codeId, setCodeId }) => {
            <input
              style={{ fontSize: fontSize.desktop.input }}
              type="text"
+              defaultValue={codeId}
              onChange={(e) => setValue(e.target.value)}
            />
            <button
--- a/src/views/Cart/Table/index.js
+++ b/src/views/Cart/Table/index.js
@ -63,7 +63,6 @@ function BasicTable(props) {
  const classes = useStyles();
  const { list, handleCounter, handleDelete, route } = props;
  const sum = () => {
-    console.log(list);
    let total = 0;
    for (let i = 0; i < list.length; i++) {
      total += list[i].count * 1;
@ -380,5 +379,5 @@ export default connect(
    info: state.book.info,
    id: state.user.status.id,
  }),
-  { pushToCart: userProduct.update }
+  { pushToCart: userProduct.add }
 )(BasicTable);
--- a/src/views/Cart/index.js
+++ b/src/views/Cart/index.js
@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import { connect } from "react-redux";
-import { userProduct, transport } from "~/Redux/actions";
+import { userProduct, transport, userFactor } from "~/Redux/actions";
 import { ToastContainer } from "react-toastify";

 import Navbar from "../Home/Navbar/index";
@ -48,6 +48,9 @@ class Cart extends Component {

  componentDidUpdate(prevProps, prevState) {
    if (this.props.list.length > 0) {
+      if (this.props.factorInfo === null) {
+        this.props.getFactorInfo({ id: this.props.list[0].factorId });
+      }
      let wantedId; //should be zero
      for (let item of this.props.list) {
        if (item.condition) {
@ -96,7 +99,7 @@ class Cart extends Component {
  };

  render() {
-    const { list, payPrice, payMethods } = this.props;
+    const { list, payPrice, payMethods, factorInfo } = this.props;
    return (
      <>
        {window.innerWidth > 1000 ? (
@ -200,7 +203,12 @@ class Cart extends Component {

                <div className="d-flex justify-content-between">
                  {this.props.payMethods.map((item, i) => (
-                    <DeliveryMethod data={item} key={i} parent={this} />
+                    <DeliveryMethod
+                      data={item}
+                      key={i}
+                      parent={this}
+                      transportId={factorInfo ? factorInfo.transportId : null}
+                    />
                  ))}
                </div>
              </div>
@ -263,10 +271,12 @@ export default connect(
    list: state.userProduct.list,
    payPrice: state.userProduct.sum,
    payMethods: state.transport.list,
+    factorInfo: state.userFactor.info,
  }),
  {
    getList: userProduct.list,
    getInfo: userProduct.info,
    getTransportList: transport.list,
+    getFactorInfo: userFactor.info,
  }
 )(Cart);
--- a/src/views/Home/HomeScroll/index.scss
+++ b/src/views/Home/HomeScroll/index.scss
@ -15,7 +15,7 @@
      }
      span {
        position: absolute;
-        width: 40%;
+        width: 100%;
        height: 3px;
        border-radius: 10px;
        background-color: #7dc241;
@ -26,12 +26,15 @@

    &--more {
      cursor: pointer;
+      text-decoration: none;
+      padding-left: 20px;
      span {
        color: #7dc241;
        font-family: numeralMedium;
+        padding-left: 3px;
      }
      img {
-        width: 15px;
+        width: 12px;
        height: 12px;
        transform: rotate(90deg);
      }
@ -78,10 +81,12 @@
    }

    &--more {
+      text-decoration: none;
      span {
        font-size: calc(100vw / 35);
        color: #7dc241;
        font-family: numeralMedium;
+        padding-left: 3px;
      }
      img {
        width: 15px;
--- a/src/views/Home/HomeSlider/Blog/index.js
+++ b/src/views/Home/HomeSlider/Blog/index.js
@ -1,5 +1,8 @@
 import React, { Component } from "react";
 import { Link } from "react-router-dom";
+import music from "~/assets/images/music.jpg";
+import video from "~/assets/images/film.jpg";
+import moment from "jalali-moment";

 import "./index.scss";

@ -13,6 +16,13 @@ const fontSize = {
    a: window.innerWidth > maxDesktopSize ? 15 : window.innerWidth / 90,
  },
 };
+
+const colors = [
+  { name: "علمی تخیلی", color: "red" },
+  { name: "سیاسی", color: "blue" },
+  { name: "تاریخی", color: "orange" },
+  { name: "ورزشی", color: "yellow" },
+];
 export default class Simple extends Component {
  render() {
    const { height, data } = this.props;
@ -26,36 +36,51 @@ export default class Simple extends Component {
            }}
          >
            <Link to={`/blogs/${data.id}`}>
-              <img
-                src={`https://dnvn.ir/api/v1/file/${data.fileId}`}
-                alt={data.title}
-              />
+              {data.type === "image" ? (
+                <img
+                  src={`https://dnvn.ir/api/v1/file/${data.fileIds}`}
+                  alt={data.title}
+                />
+              ) : null}
+              {data.type === "video" ? (
+                <img src={video} alt={data.title} />
+              ) : null}
+              {data.type === "audio" ? (
+                <img src={music} alt={data.title} />
+              ) : null}
              <h1 style={{ fontSize: fontSize.desktop.h1 }}>{data.title}</h1>
-              <h2 style={{ fontSize: fontSize.desktop.h2 }}>{data.subTitle}</h2>
+              <h2 style={{ fontSize: fontSize.desktop.h2 }}>
+                {data.text.slice(0, 100)} ...
+              </h2>
              <div className="slider-blog__footer d-flex mt-3">
                <div className="d-flex">
                  {/* <img src={} /> */}
                  <div className="d-flex flex-column">
                    <span style={{ fontSize: fontSize.desktop.span }}>
-                      مطالعه کامل در {data.duration}
+                      مطالعه کامل در {data.duration} دقیقه
                    </span>
                    <span style={{ fontSize: fontSize.desktop.span }}>
-                      تاریخ انتشار {data.data}
+                      تاریخ انتشار {moment(data.createdAt).format("YYYY/MM/DD")}
                    </span>
                  </div>
                </div>
-                <Link style={{ fontSize: fontSize.desktop.a }} to={data.link}>
-                  {data.buttonText}
+                <Link
+                  style={{ fontSize: fontSize.desktop.a }}
+                  to={`/blogs/${data.id}`}
+                >
+                  ادامه مطلب
                </Link>
              </div>
              <span
                className="slider-blog__category"
                style={{
-                  backgroundColor: data.category.color,
+                  backgroundColor: colors.filter(
+                    (item) => item.name === data.tag
+                  )[0].color,
                  fontSize: fontSize.desktop.span,
                }}
              >
-                {data.category.name}
+                {data.tag}
              </span>
            </Link>
          </article>
@ -67,25 +92,38 @@ export default class Simple extends Component {
              height: height,
            }}
          >
-            <Link to={data.link}>
-              <img src={data.image} alt={data.title} />
+            <Link to={`/blogs/${data.id}`}>
+              {data.type === "image" ? (
+                <img
+                  src={`https://dnvn.ir/api/v1/file/${data.fileIds}`}
+                  alt={data.title}
+                />
+              ) : null}
+              {data.type === "video" ? (
+                <img src={video} alt={data.title} />
+              ) : null}
+              {data.type === "audio" ? (
+                <img src={music} alt={data.title} />
+              ) : null}
              <h1>{data.title}</h1>
-              <h2>{data.subTitle}</h2>
+              <h2>{data.text.slice(0, 100)}...</h2>
              <div className="mobile-slider-blog__footer d-flex mt-3">
                <div className="d-flex">
                  {/* <img src={} /> */}
                  <div className="d-flex flex-column">
-                    <span>مطالعه کامل در {data.duration}</span>
-                    <span>تاریخ انتشار {data.data}</span>
+                    <span>مطالعه کامل در {data.duration} دقیقه</span>
+                    <span>
+                      تاریخ انتشار {moment(data.createdAt).format("YYYY/MM/DD")}
+                    </span>
                  </div>
                </div>
-                <Link to={data.link}>{data.buttonText}</Link>
+                <Link to={`/blogs/${data.id}`}>{data.buttonText}</Link>
              </div>
              <span
                className="mobile-slider-blog__category"
-                style={{ backgroundColor: data.category.color }}
+                // style={{ backgroundColor: data.category.color }}
              >
-                {data.category.name}
+                {data.tag}
              </span>
            </Link>
          </article>
--- a/src/views/Home/HomeSlider/index.js
+++ b/src/views/Home/HomeSlider/index.js
@ -1,4 +1,5 @@
 import React, { Component } from "react";
+import { Link } from "react-router-dom";
 import Carousel from "react-elastic-carousel";
 import Simple from "./Simple/index";
 import Header from "./Header/index";
@ -12,7 +13,7 @@ const maxDesktopSize = 1250;

 const fontSize = {
  desktop: {
-    h1: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 65,
+    h1: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 70,
    span: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 75,
  },
 };
@ -26,10 +27,13 @@ const SimpleHeader = (props) => {
            <h1 style={{ fontSize: fontSize.desktop.h1 }}>{props.title}</h1>
            <span></span>
          </div>
-          <div className="home-scroll__header--more d-flex">
-            <span style={{ fontSize: fontSize.desktop.h1 }}>ادامه لیست</span>
+          <Link
+            to={props.link}
+            className="home-scroll__header--more d-flex align-items-center"
+          >
+            <span style={{ fontSize: fontSize.desktop.h1 }}>بیشتر</span>
            <img src={dropdown} alt="فلش" />
-          </div>
+          </Link>
        </div>
      ) : null}
      {window.innerWidth < 1000 ? (
@ -38,10 +42,13 @@ const SimpleHeader = (props) => {
            <h1>{props.title}</h1>
            <span></span>
          </div>
-          <div className="mobile-home-scroll__header--more d-flex">
-            <span>ادامه لیست</span>
+          <Link
+            to={props.link}
+            className="mobile-home-scroll__header--more d-flex align-items-center"
+          >
+            <span>بیشتر</span>
            <img src={dropdown} alt="فلش" />
-          </div>
+          </Link>
        </div>
      ) : null}
    </>
@ -57,10 +64,13 @@ const TabHeader = (props) => {
            <h1 style={{ fontSize: fontSize.desktop.h1 }}>{props.title}</h1>
            <span></span>
          </div>
-          <div className="home-scroll__header--more d-flex">
-            <span style={{ fontSize: fontSize.desktop.h1 }}>ادامه لیست</span>
+          <Link
+            to={props.link}
+            className="home-scroll__header--more d-flex align-items-center"
+          >
+            <span style={{ fontSize: fontSize.desktop.h1 }}>بیشتر</span>
            <img src={dropdown} alt="فلش" />
-          </div>
+          </Link>
        </div>
      ) : null}
      {window.innerWidth < 1000 ? (
@ -69,8 +79,8 @@ const TabHeader = (props) => {
            <h1>{props.title}</h1>
            <span></span>
          </div>
-          <div className="mobile-home-scroll__header--more d-flex">
-            <span>ادامه لیست</span>
+          <div className="mobile-home-scroll__header--more d-flex align-items-center">
+            <span>بیشتر</span>
            <img src={dropdown} alt="فلش" />
          </div>
        </div>
@ -81,13 +91,13 @@ const TabHeader = (props) => {

 export default class HomeSlider extends Component {
  render() {
-    const { data, title, height, designType, number } = this.props;
+    const { data, title, height, designType, number, link } = this.props;
    let header;
    if (title) {
      if (designType === "simple" || designType === "blog") {
-        header = <SimpleHeader title={title} />;
+        header = <SimpleHeader title={title} link={link} />;
      } else if (designType === "tab") {
-        header = <TabHeader title={title} />;
+        header = <TabHeader title={title} link={link} />;
      }
    }
    return (
--- a/src/views/Home/Membership/Input/index.js
+++ b/src/views/Home/Membership/Input/index.js
@ -8,9 +8,11 @@ const useStyles = makeStyles((theme) => ({
      width: "200px",
      position: "relative",
      marginRight: 30,
+      fontFamily: "numeralLight",
    },
    input: {
      border: "0px",
+      fontFamily: "numeralLight",
    },
  },
 }));
--- a/src/views/Home/Membership/index.scss
+++ b/src/views/Home/Membership/index.scss
@ -33,6 +33,11 @@

  .MuiOutlinedInput-input {
    padding: 20px 14px !important;
+    font-family: numeralLight !important;
+    color: #4e4e4e !important;
+    &:focus {
+      outline: none !important;
+    }
  }
  .MuiInputLabel-outlined {
    font-family: numeralLight !important;
--- a/src/views/Home/SingleBlog/index.scss
+++ b/src/views/Home/SingleBlog/index.scss
@ -1,23 +1,23 @@
-.single-blog{
+.single-blog {
  width: 100%;
  margin: 75px 0px;
-  &__right{
+  &__right {
    width: 50%;
    height: 100%;
    align-items: flex-start;
-    padding-left: 15%;
-    h1{
+    padding-left: 40px;
+    h1 {
      font-family: numeralBold;
      color: #1bbc6e;
      text-align: justify;
    }
-    p{
+    p {
      font-family: numeralLight;
      text-align: justify;
      margin-top: 15px;
      color: #a5a5a5;
    }
-    a{
+    a {
      font-family: numeralMedium;
      align-self: flex-end;
      padding: 8px 12px;
@ -26,15 +26,15 @@
      border-radius: 5px;
      border: 1px solid #1bbc6e;
      margin-top: 20px;
-      &:hover{
+      &:hover {
        color: #1bbc6e;
      }
    }
  }
-  &__left{
+  &__left {
    width: 50%;
    height: 100%;
-    img{
+    img {
      width: 100%;
      height: 100%;
      border-radius: 20px;
--- a/src/views/Home/index.js
+++ b/src/views/Home/index.js
@ -120,23 +120,28 @@ const Identifier = (props) => {
        />
      ) : null}
      {props.item.type === "scroll" ? (
-        <HomeScroll
-          number={props.item.number}
-          height={props.item.height}
-          title={props.item.title}
-          data={props.item.data}
-          designType={props.item.design}
-          moreText={props.item.moreText}
-        />
+        props.item.data.length > 0 ? (
+          <HomeScroll
+            number={props.item.number}
+            height={props.item.height}
+            title={props.item.title}
+            data={props.item.data}
+            designType={props.item.design}
+            moreText={props.item.moreText}
+          />
+        ) : null
      ) : null}
      {props.item.type === "slider" ? (
-        <HomeSlider
-          designType={props.item.design}
-          number={props.item.number}
-          height={props.item.height}
-          title={props.item.title}
-          data={props.item.data}
-        />
+        props.item.data.length > 0 ? (
+          <HomeSlider
+            designType={props.item.design}
+            number={props.item.number}
+            height={props.item.height}
+            title={props.item.title}
+            data={props.item.data}
+            link={props.item.link}
+          />
+        ) : null
      ) : null}
      {props.item.type === "search" && window.innerWidth > 1000 ? (
        <HomeSearch height={props.item.height} data={props.item.data} />