بهط ئخذهمث اخئث1

src/AppRouter.js

@@ -67,24 +67,17 @@ class AppRouter extends Component {
   render() {
     const mobile = window.innerWidth < 1000 ? true : false;
     let status = proxy.status();
-    let home = mobile ? (
+    console.log({ status });
+    let home = (
       <Route exact path={"/"}>
-        {status ? (
-          this.props.profile.status ? (
-            <Home />
-          ) : (
-            // <Auth />
+        {status && status.status == 0 ? (
           <Auth page={"profile"} />
-          )
         ) : (
-          <Auth />
+          <Home status={status} />
         )}
       </Route>
-    ) : (
-      <Route exact path={"/"}>
-        <Home />
-      </Route>
     );
+
     return (
       <Router>
         <Switch>

src/Redux/reducers/public.js

@@ -35,21 +35,23 @@ export default function publicApi(state = initialState, action) {
   switch (type) {
     case "public/homePage":
       let itemsLevel;
-      if (window.innerWidth > 1000) {
+      //  if (window.innerWidth > 1000) {
       const jadidTarin = data.filter(
         (item) => item.title === "جدیدترین کتاب‌های دانوین"
       );
-        itemsLevel = jadidTarin[0].data
+      itemsLevel = jadidTarin[0]
+        ? jadidTarin[0].data
             .map((item) => item.book.gradeId * 1)
             .sort((a, b) => a - b)
-          .map((e) => grades[e]);
-        itemsLevel.unshift("همه");
-      }
+            .map((e) => grades[e])
+        : [];
+      itemsLevel.unshift("پایه تحصیلی");
+      //  }
 
       return {
         ...state,
         loading: false,
-        levels: window.innerWidth > 1000 ? [...new Set(itemsLevel)] : [],
+        levels: [...new Set(itemsLevel)],
         error: null,
         homeData: data,
       };

src/views/Home/Footer/index.js

@@ -17,24 +17,21 @@ export default class Footer extends Component {
                 <div className="footer-container__content--box first d-flex flex-column">
                   <h1>دانوین کجاست؟</h1>
                   <p className="mt-2">
-                    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و
-                    با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه
-                    و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی
-                    تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای
-                    کاربردی می باشد، کتابهای زیادی در شصت و سه{" "}
+                    ما در دانوین با هدف ایجاد زیرساخت تعاملی و آموزشی با تولید
+                    محتوایی جذاب بصورت کتاب قصد داریم تغییراتی بنیادین در نظام
+                    آموزش و پرورش کشور ایجاد کنیم.
                   </p>
                   <div className="footer__location d-flex align-items-center mt-2">
                     <img src={location} alt="آدرس" className="m-1" />
-                    <p>
-                      تهران خیابان انقلاب اسلامی بن بست سروش پلاک 2 طبقه چهار
-                    </p>
+                    <p>آدرس: تهران، میدان فردوسی، خیابان موسوی، پلاک ۳۰</p>
+                    {/* <p>شماره تماس: ۸۸۸۱۴۶۳۷-۰۲۱ </p> */}
                   </div>
                   <div
                     className="d-flex align-items-center mt-1"
                     style={{ width: "55%", justifyContent: "space-between" }}
                   >
                     <div className="d-flex align-items-center">
-                      <span>02163462405</span>
+                      <span>۸۸۸۱۴۶۳۷</span>
                       <img src={contact} alt="تماس" className="m-1" />
                     </div>
                     <div className="d-flex align-items-center">

src/views/Home/HomeSearch/Select/index.js

@@ -56,7 +56,8 @@ export default function CustomizedSelects(props) {
             parent.setState({
               filters: {
                 ...parent.state.filters,
-                [name]: e.target.value === "همه" ? [] : [e.target.value],
+                [name]:
+                  e.target.value === "پایه تحصیلی" ? [] : [e.target.value],
               },
             })
           }

src/views/Home/HomeSearch/index.js

@@ -25,7 +25,7 @@ class HomeSearch extends Component {
 
   render() {
     const { height, levels } = this.props;
-    return (
+    return window.innerWidth > 1000 ? (
       <div className="home-search d-flex">
         <input
           placeholder="جستجو در عناوین کتاب ..."
@@ -44,6 +44,44 @@ class HomeSearch extends Component {
         </div>
         <button className="home-search__submit">جستجو</button>
       </div>
+    ) : (
+      <>
+        <div className="home-mobile-search d-flex">
+          <div className="home-mobile-search__select" style={{ width: "100%" }}>
+            <Select options={levels} name="levels" parent={this} />
+            <img src={dropdown} alt="فلش" />
+          </div>
+        </div>
+        <div className="home-mobile-search  ">
+          <input
+            ref="input"
+            placeholder="نام یک کتاب را جستجو کنید"
+            className="home-mobile-search__input "
+            type="text"
+            name="searchBox"
+            onChange={(e) =>
+              this.setState({
+                filters: { ...this.state.filters, search: e.target.value },
+              })
+            }
+          />
+
+          <button
+            className="home-mobile-search__submit"
+            style={{ float: "left" }}
+            onClick={() => {
+              this.setState({
+                filters: {
+                  ...this.state.filters,
+                  search: this.refs.input.value,
+                },
+              });
+            }}
+          >
+            جستجو
+          </button>
+        </div>
+      </>
     );
   }
 }

src/views/Home/HomeSearch/index.scss

@@ -48,9 +48,10 @@
       padding: 5px 10px 5px 100px !important;
     }
   }
+
   &__select {
-    position: relative;
-    margin-left: 20px;
+    // position: relative;
+    // margin-left: 20px;
     & img {
       position: absolute;
       left: 27px;
@@ -67,3 +68,99 @@
     padding: 7px 50px;
   }
 }
+
+.home-mobile-search {
+  // width: 100%;
+  // padding: 5px;
+  // box-shadow: 0px 0px 2px rgb(200, 200, 200);
+  // border-radius: 7px;
+  justify-content: space-between;
+  align-items: center;
+  flex: 1;
+  margin: 10px 7px 0;
+  font-family: numeralLight;
+  &__input:focus {
+    // border: 1px solid green;
+    box-shadow: 0px 0px 6px rgb(42, 197, 63);
+  }
+  &__input {
+    width: 100%;
+    padding: 10px;
+    box-shadow: 0px 0px 2px rgb(200, 200, 200);
+    border: 0px;
+    flex: 1;
+    border: 0px;
+    border-radius: 7px;
+    font-size: 11px;
+    color: green;
+    // padding: 5px 10px 0px;
+    font-size: 16px;
+    &::placeholder {
+      color: #d8dce5;
+      font-size: 16px;
+    }
+    &:focus {
+      outline: 0px !important;
+    }
+  }
+  .MuiFormControl-root {
+    margin: 0px !important;
+    margin-right: 0px !important;
+    width: 100%;
+    select:focus {
+      // border: 1px solid green;
+      box-shadow: 0px 0px 6px rgb(42, 197, 63);
+    }
+    select {
+      padding: 10px;
+      box-shadow: 0px 0px 2px rgb(200, 200, 200);
+      font-family: numeralLight;
+      height: 100%;
+      width: 100% !important;
+      direction: rtl;
+      border: 0px !important;
+      border-radius: 7px;
+      text-align: center !important;
+
+      color: #02733c !important;
+      &:focus {
+        background-color: white !important;
+      }
+    }
+    .MuiNativeSelect-icon {
+      display: none;
+    }
+    .MuiNativeSelect-select {
+      // padding: 5px 10px 5px 100px !important;
+    }
+  }
+  &__select {
+    position: relative;
+    width: 100%;
+    // margin-left: 5px;
+    position: relative;
+    top: 5px;
+    & img {
+      position: relative;
+      top: -20px;
+      left: 10px;
+      float: left;
+      width: 20px;
+      height: 10px;
+    }
+    select {
+      width: 100%;
+    }
+  }
+  &__submit {
+    position: relative;
+    top: -37px;
+    left: 5px;
+    border: 0px;
+    background-color: #7dc241;
+    font-size: 13px;
+    color: white;
+    border-radius: 5px;
+    padding: 5px 7px;
+  }
+}

src/views/Home/HomeSlider/Blog/index.js

@@ -110,14 +110,19 @@ export default class Simple extends Component {
               <div className="mobile-slider-blog__footer d-flex mt-3">
                 <div className="d-flex">
                   {/* <img src={} /> */}
-                  <div className="d-flex flex-column">
+                  <div
+                    className="d-flex flex-column"
+                    style={{ fontSize: "12px" }}
+                  >
                     <span>مطالعه کامل در {data.duration} دقیقه</span>
                     <span>
                       تاریخ انتشار {moment(data.createdAt).format("YYYY/MM/DD")}
                     </span>
                   </div>
                 </div>
-                <Link to={`/blogs/${data.id}`}>{data.buttonText}</Link>
+                <Link to={`/blogs/${data.id}`}>
+                  {data.buttonText || "ادامه مطلب"}
+                </Link>
               </div>
               <span
                 className="mobile-slider-blog__category"

src/views/Home/HomeSlider/Blog/index.scss

@@ -62,13 +62,17 @@
 
 .mobile-slider-blog {
   margin: 10px;
-  padding: 5px 8px;
-  box-shadow: 0px 0px 5px rgb(200, 200, 200);
+  padding: 5px 5px;
+  // box-shadow: 0px 0px 5px rgb(200, 200, 200);
+  border: 1px solid #eee;
   border-radius: 15px;
   width: 100%;
   text-decoration: none;
   position: relative;
   cursor: pointer;
+  a {
+    text-decoration: none;
+  }
   img {
     width: 100%;
     height: 150px;
@@ -76,25 +80,28 @@
   }
   h1 {
     font-family: numeralMedium;
-    margin-top: 15px;
-    font-size: calc(100vw / 35);
+    margin-top: 8px;
+    font-size: 15px;
     color: #6f7074;
+    text-decoration: none;
   }
   h2 {
     font-family: numeralLight;
     margin-top: 5px;
-    font-size: calc(100vw / 50);
+    font-size: 12px;
+    text-decoration: none;
     color: #a5a5a5;
   }
   &__category {
-    font-family: numeralMedium;
+    font-family: numeralLight;
     position: absolute;
     top: 10px;
-    left: 13px;
+    left: 10px;
     color: white;
     padding: 5px 7px;
     border-radius: 5px;
-    font-size: calc(100vw / 60);
+    font-size: 12px;
+    background-color: #ffffff44;
   }
 
   &__footer {
@@ -102,20 +109,21 @@
     align-items: center;
     justify-content: space-between;
     a {
-      font-family: numeralMedium;
-      padding: 6px 12px;
+      font-family: numeralLight;
+      font-size: 11px;
+      padding: 3px 6px;
       background-color: #e6e6e6;
       color: #02733c;
       text-decoration: none;
       border-radius: 5px;
-      font-size: calc(100vw / 50);
+      font-size: 10px;
       &:hover {
         color: #02733c;
       }
     }
     span {
       font-family: numeralLight;
-      font-size: calc(100vw / 50);
+      font-size: 11px;
       color: #a5a5a5;
       letter-spacing: -1px;
     }

src/views/Home/HomeSlider/Header/index.scss

@@ -53,9 +53,9 @@
     & img {
       position: relative;
       // width: 200%;
-      height: 110%;
+      height: 100%;
       // right: 40px;
-      bottom: 10px;
+      //  bottom: 10px;
     }
   }
   &__left {

src/views/Home/HomeSlider/Simple/index.js

@@ -1,8 +1,8 @@
 import React, { Component } from "react";
 import { Link } from "react-router-dom";
-
+import proxy from "~/Redux/proxy";
 import "./index.scss";
-
+const status = proxy.status();
 const maxDesktopSize = 1250;
 
 const fontSize = {
@@ -17,6 +17,7 @@ const fontSize = {
 
 export default class Simple extends Component {
   render() {
+    const mobile = window.innerWidth < 1000;
     const { height, data } = this.props;
     return (
       <article
@@ -31,13 +32,20 @@ export default class Simple extends Component {
           <img
             src={`https://dnvn.ir/api/v1/file/${data.book.fileIds}`}
             alt={data.title}
+            style={{ height: mobile && !status ? 160 : null }}
           />
-          <h1 style={{ fontSize: fontSize.desktop.h1 }}>{data.name}</h1>
-          <h2 style={{ fontSize: fontSize.desktop.h2 }}>{data.subTitle}</h2>
+          <h1 style={{ fontSize: mobile ? 14 : fontSize.desktop.h1 }}>
+            {data.name}
+          </h1>
+          {data.subTitle ? (
+            <h2 style={{ fontSize: mobile ? 14 : fontSize.desktop.h2 }}>
+              {data.subTitle}
+            </h2>
+          ) : null}
           {data.price ? (
             <div className="slider-simple__price d-flex justify-content-center">
               <div
-                style={{ fontSize: fontSize.desktop.available }}
+                style={{ fontSize: mobile ? 14 : fontSize.desktop.available }}
                 className="slider-simple__price--price d-flex"
               >
                 {data.price} تومان

src/views/Home/HomeSlider/Simple/index.scss

@@ -1,5 +1,6 @@
 .slider-simple {
-  padding: 10px;
+  padding: 0 10px;
+  text-align: center;
   a {
     width: 100%;
     text-decoration: none;
@@ -13,13 +14,14 @@
     }
     h1 {
       font-family: numeralMedium;
-      margin-top: 15px;
-      color: #7dc241;
+      margin-top: 5px;
+      margin-bottom: 5px;
+      color: #41c26f;
       letter-spacing: -1px;
     }
     h2 {
       font-family: numeralLight;
-      margin-top: 10px;
+      margin-top: 5px;
       color: #6f7074;
     }
   }
@@ -32,7 +34,7 @@
   }
   &__price {
     width: 100%;
-    margin-top: 15px;
+    margin-top: 5px;
     text-align: center;
     &--old {
       font-family: numeralLight;

src/views/Home/HomeSlider/index.js

@@ -146,7 +146,7 @@ export default class HomeSlider extends Component {
               itemsToShow={number}
               isRTL={true}
               enableTilt={false}
-              showArrows={true}
+              showArrows={false}
               pagination={false}
             >
               {data.map((item, i) => (

src/views/Home/HomeStatic/Identifier/index.js

@@ -1,29 +1,17 @@
-import React from 'react';
-import Flex from '../Flex/index';
-import Simple from '../Simple/index';
-import Vitrin from '../Vitrin/index';
-import Column from '../3D/index';
+import React from "react";
+import Flex from "../Flex/index";
+import Simple from "../Simple/index";
+import Vitrin from "../Vitrin/index";
+import Column from "../3D/index";
 
-export default function Identifier(props){
-  const {data} = props;
-  return(
+export default function Identifier(props) {
+  const { data, status } = props;
+  return (
     <>
-      {
-        data.design === 'flex' ?
-        <Flex data={data} /> : null
-      }
-      {
-        data.design === 'simple' ?
-        <Simple data={data} /> : null
-      }
-      {
-        data.design === 'vitrin' ?
-        <Vitrin data={data} /> : null
-      }
-      {
-        data.design === '3d' ?
-        <Column data={data} /> : null 
-      }
+      {data.design === "flex" ? <Flex data={data} /> : null}
+      {data.design === "simple" ? <Simple data={data} status={status} /> : null}
+      {data.design === "vitrin" ? <Vitrin data={data} /> : null}
+      {data.design === "3d" ? <Column data={data} /> : null}
     </>
   );
 }

src/views/Home/HomeStatic/Simple/index.js

@@ -9,7 +9,7 @@ const fontSize = {
 };
 
 export default function Simple(props) {
-  const { data } = props;
+  const { data, status } = props;
   const parentStyle = {
     // backgroundImage: `url('${data.imageUrl}')`,
     background: data.fileId

src/views/Home/HomeStatic/Vitrin/index.js

@@ -23,38 +23,39 @@ export default function Vitrin(props) {
   };
 
   return (
-    <div
+    <Link
+      to={data.link}
       className="mobile-home-static__vitrin d-flex flex-column"
       style={style}
     >
-      <Link to={data.link}>
+      <span to={data.link}>
         <h1 style={{ fontSize: fontSize.h1 }}>{data.title}</h1>
-      </Link>
+      </span>
 
       <div className="d-flex align-items-end" style={{ margin: "auto" }}>
         {data.books.map((item, i) => (
           <Item data={item} key={i} />
         ))}
 
-        <Link to={data.link} style={{ fontSize: fontSize.span }}>
+        <span to={data.link} style={{ fontSize: fontSize.span }}>
           مشاهده بیشتر
-        </Link>
-      </div>
+        </span>
       </div>
+    </Link>
   );
 }
 
 const Item = (props) => {
   const { data } = props;
   return (
-    <Link
-      to={"/products/physical/" + data.id}
+    <div
+      // to={"/products/physical/" + data.id}
       className="mobile-home-static__vitrin--product d-flex"
     >
       <img
         src={`https://dnvn.ir/api/v1/file/${data.fileId}`}
         alt={"عکس محصول"}
       />
-    </Link>
+    </div>
   );
 };

src/views/Home/HomeStatic/index.js

@@ -1,9 +1,9 @@
 import React, { Component } from "react";
 import ChevronLeftIcon from "@material-ui/icons/ChevronLeft";
 import Identifier from "./Identifier/index";
-
+import proxy from "~/Redux/proxy";
 import "./index.scss";
-
+const status = proxy.status();
 const maxDesktopSize = 1250;
 
 const fontSize = {
@@ -49,11 +49,15 @@ export default class HomeStatic extends Component {
         {window.innerWidth < 1000 ? (
           <section
             className="mobile-home-static d-flex"
-            style={{ height: height }}
+            style={{ height: height, margin: "5px 0px" }}
           >
-            {data.map((item, i) => (
-              <Identifier data={item} key={i} />
-            ))}
+            {data.map((item, i) =>
+              status ? (
+                <Identifier data={item} key={i} status={status} />
+              ) : (
+                <Item data={item} height={height} key={i} />
+              )
+            )}
           </section>
         ) : null}
       </>
@@ -85,7 +89,29 @@ const Item = (props) => {
             alt="عکس"
           />
         </div>
-      ) : null}
+      ) : (
+        <div
+          style={{
+            width: `${props.data.width}%`,
+            height: props.height,
+          }}
+          className="home-static__list2--item"
+        >
+          <img
+            src={`https://dnvn.ir/api/v1/file/${props.data.fileId}`}
+            alt="عکس"
+            style={{ float: "left" }}
+          />
+          <div className="d-flex flex-column">
+            <h2 style={{ color: "#02733c", fontSize: 12 }}>
+              {props.data.topText}
+            </h2>
+            <h2 style={{ color: "#7dc241", fontSize: 12 }}>
+              {props.data.bottomText}
+            </h2>
+          </div>
+        </div>
+      )}
     </>
   );
 };

src/views/Home/HomeStatic/index.scss

@@ -1,6 +1,7 @@
 .home-static {
   margin: 20px 0px;
   width: 100%;
+  justify-content: space-between;
   &__list {
     justify-content: space-between;
     width: 100%;
@@ -24,6 +25,35 @@
       }
     }
   }
+  &__list2 {
+    justify-content: space-between;
+    // width: 50%;
+    &--item {
+      // box-shadow: 0px 0px 5px rgb(200, 200, 200);
+      border: 1px solid #eee;
+      font-family: numeralMedium;
+      align-items: center;
+      border-radius: 10px;
+      margin: 5px;
+      padding: 15px 10px;
+      justify-content: space-around;
+      text-align: center;
+      div {
+        text-align: right;
+        h2 {
+          // font-weight: bold;
+          font-size: 20px;
+          letter-spacing: -1px;
+        }
+      }
+      img {
+        padding-top: 5px;
+        margin: auto;
+        // border-radius: 10px;
+        height: 35px;
+      }
+    }
+  }
 }
 
 .mobile-home-static {

src/views/Home/Navbar/Laptop/index.js

@@ -91,7 +91,7 @@ export default class LaptopNavbar extends Component {
                 to={"/auth"}
                 className="laptop-navbar__signup"
               >
-                ورود به حساب کاربری
+                ورود یا ثبت‌نام
               </Link>
             </>
           )}

src/views/Home/Navbar/Mobile/NavbarDrawer/NavbarDrawer.js

@@ -20,7 +20,7 @@ import mobileMail from "~/assets/icons/mobileMail.svg";
 import mobileProfile from "~/assets/icons/mobileProfile.svg";
 import mobileDanger from "~/assets/icons/mobileDanger.svg";
 import mobileLogout from "~/assets/icons/mobileLogout.svg";
-
+import proxy from "~/Redux/proxy";
 import "./NavbarDrawer.scss";
 class NavbarDrawer extends Component {
   state = {
@@ -28,10 +28,64 @@ class NavbarDrawer extends Component {
   };
 
   render() {
+    const statusx = proxy.status();
+    this.links = [
+      {
+        name: "صفحه اصلی",
+        link: "/",
+        icon: <img src={mobileHome} alt="صفحه اصلی" />,
+        toast: "",
+        message: "",
+      },
+      {
+        name: "ورود یا ثبت نام",
+        link: "/auth",
+        icon: <img src={mobileLogout} alt="کتاب‌های من" />,
+        toast: "",
+        message: "",
+      },
+      {
+        name: "فروشگاه",
+        link: "/products",
+        icon: <img src={mobileBlog} alt="کتاب‌های من" />,
+        toast: "",
+        message: "",
+      },
+      {
+        name: "بلاگ",
+        link: "/blogs",
+        icon: <img src={mobileBlog} alt="بلاگ" />,
+        toast: "",
+        message: "",
+      },
+      {
+        name: "پشتیبانی",
+        link: "/support",
+        icon: <img src={mobileDanger} alt="پشتیبانی" />,
+        toast: "",
+        message: "",
+        // onClick: this.props.logout,
+      },
+      {
+        name: "خروج",
+        link: "/auth",
+        icon: <img src={mobileLogout} alt="خروج" />,
+        toast: "",
+        message: "",
+        onClick: () => {
+          localStorage.removeItem("refresh");
+          localStorage.removeItem("access");
+          localStorage.removeItem("userData");
+          window.location.reload();
+        },
+      },
+    ];
     const { status } = this.props;
+
     let score = 2;
     return (
       <div className="navbar-drawer d-flex flex-column">
+        {statusx ? (
           <div className="navbar-drawer__header d-flex align-items-center">
             <>
               <Avatar
@@ -43,6 +97,7 @@ class NavbarDrawer extends Component {
                     : ""
                 }
               />
+
               <div className="navbar-drawer__header--right d-fex flex-column">
                 <h1>{status.firstName + " " + status.lastName}</h1>
               </div>
@@ -62,10 +117,13 @@ class NavbarDrawer extends Component {
                 onClick={() => this.setState({ dropdown: true })}
               >
                 {score ? <span>{score} امتیاز</span> : null}{" "}
-              <KeyboardArrowDownIcon style={{ color: "grey", fontSize: 30 }} />
+                <KeyboardArrowDownIcon
+                  style={{ color: "grey", fontSize: 30 }}
+                />
               </div>
             )}
           </div>
+        ) : null}
         {this.state.dropdown ? (
           <div className="navbar-drawer__dropdown d-flex flex-column">
             {/* {this.props.users.map((item, i) => (
@@ -87,7 +145,7 @@ class NavbarDrawer extends Component {
           </div>
         ) : null}
         <div className="navbar-drawer__bottom mt-3">
-          {this.props.links.map((item, key) => (
+          {(statusx ? this.props.links : this.links).map((item, key) => (
             <Link
               to={item.link}
               key={key}

src/views/Home/Navbar/Mobile/index.js

@@ -11,9 +11,23 @@ import qr from "../../../../assets/icons/qr.png";
 import back from "../../../../assets/icons/back.png";
 import hamburger from "../../../../assets/icons/hamburger.png";
 import search from "../../../../assets/icons/navbarSearch.png";
+import proxy from "~/Redux/proxy";
 
 import "./index.scss";
-
+const maxDesktopSize = 1250;
+const maxMobileSize = 650;
+const fontSize = {
+  desktop: {
+    li: window.innerWidth > maxDesktopSize ? 15 : window.innerWidth / 85,
+    a: window.innerWidth > maxDesktopSize ? 15 : window.innerWidth / 85,
+  },
+  mobile: {
+    h1: window.innerWidth > maxMobileSize ? 30 : window.innerWidth / 18,
+    p: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 28,
+    h2: window.innerWidth > maxMobileSize ? 20 : window.innerWidth / 23,
+    li: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 28,
+  },
+};
 const useStyles = makeStyles({
   list: {
     width: window.innerWidth * 0.8,
@@ -26,6 +40,7 @@ const useStyles = makeStyles({
 });
 
 export default function MobileNavbar(props) {
+  const status = proxy.status();
   const classes = useStyles();
   const [state, setState] = useState({
     top: false,
@@ -63,21 +78,62 @@ export default function MobileNavbar(props) {
       />
     </div>
   );
+  if (!status)
     return (
       <nav className="mobile-navbar d-flex">
+        <div>
           <div
+            className="mobile-navbar__menu"
+            onClick={toggleDrawer("right", true)}
+          >
+            <img src={hamburger} alt="منو" />
+            <Link to="/" className="mobile-navbar__logo2">
+              <img src={logo} alt="لوگو" className="logo" />
+            </Link>
+          </div>
+        </div>
+        <div className="mobile-navbar__left" style={{ marginLeft: 10 }}>
+          <Link
+            style={{ fontSize: 12 }}
+            to={"/auth"}
+            className="mobile-navbar__signup"
+          >
+            ورود یا ثبت‌نام
+          </Link>
+          {page !== "home" ? (
+            <Link to={"/"}>
+              <img src={back} alt="بازگشت" />
+            </Link>
+          ) : null}
+        </div>
+        <SwipeableDrawer
+          anchor="right"
+          open={state["right"]}
+          onClose={toggleDrawer("right", false)}
+          onOpen={toggleDrawer("right", true)}
+        >
+          {list(props, "right")}
+        </SwipeableDrawer>
+      </nav>
+    );
+  return (
+    <nav className="mobile-navbar d-flex">
+      {/* <div
         className="mobile-navbar__logo"
         // style={{ transform: page !== "home" ? "translateX(-29px)" : "none" }}
       >
         <Link to="/">
           <img src={logo} alt="لوگو" />
         </Link>
-      </div>
+      </div> */}
       <div
         className="mobile-navbar__menu"
         onClick={toggleDrawer("right", true)}
       >
         <img src={hamburger} alt="منو" />
+        <Link to="/">
+          <img src={logo} alt="لوگو" className="logo" />
+        </Link>
       </div>
 
       <div className="mobile-navbar__left">

src/views/Home/Navbar/Mobile/index.scss

@@ -9,11 +9,27 @@
   z-index: 400;
   padding: 0px 10px 0px;
   height: 50px;
+  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3);
+  &__signup {
+    font-family: numeralLight;
+    text-decoration: none;
+    color: white;
+    background-color: #6cbe44;
+    border-radius: 6px;
+    padding: 5px 10px;
+    &:hover {
+      color: white;
+    }
+  }
   &__menu {
     justify-self: flex-start;
     img {
       width: 26px;
     }
+    .logo {
+      width: 85px;
+      margin-right: 10px;
+    }
   }
   &__logo {
     position: absolute;
@@ -26,6 +42,13 @@
       width: 85px;
     }
   }
+  &__logo2 {
+    margin: 0 10px;
+    img {
+      // transform: translate(20px, 0px);
+      width: 85px;
+    }
+  }
   &__left {
     justify-self: flex-end;
     img {

src/views/Home/SingleBlog/index.js

@@ -32,7 +32,7 @@ export default class SingleBlog extends Component {
             style={{ fontSize: fontSize.desktop.a }}
             to={"/blogs/" + data.id}
           >
-            ادامه
+            ادامه مطلب
           </Link>
         </div>
         <div className="single-blog__left d-flex justify-content-center align-items-center">

src/views/Home/index.js

@@ -36,59 +36,46 @@ import Loader from "~/components/Loader/index";
 // import home_ar from "~/assets/icons/home_ar(2).png";
 
 import "./index.scss";
+
 class Home extends Component {
   componentDidMount() {
+    const mobile = window.innerWidth < 1000;
     window.scrollTo(0, 0);
-    if (window.innerWidth < 1000) {
+    if (mobile && this.props.status) {
       this.props.getHomeData({ device: 2 });
     } else {
-      this.props.getHomeData({ device: 1 });
+      this.props.getHomeData({ device: 1, mobile: mobile ? 1 : 0 });
     }
   }
 
   render() {
-    const { homeData, loading } = this.props;
+    const { homeData, loading, status } = this.props;
+    const mobile = window.innerWidth < 1000;
+    if (loading)
       return (
-      <>
-        {window.innerWidth > 1000 ? (
-          !loading ? (
-            <>
-              <div className="home d-flex flex-column">
-                <Navbar page={"home"} />
-                {homeData.map((item, i) => (
-                  <Identifier item={item} key={i} />
-                ))}
-              </div>
-              <Footer />
-            </>
-          ) : (
         <div
           className="d-flex justify-content-center align-items-center"
           style={{ height: "100vh", width: "100vw" }}
         >
           <Loader />
         </div>
-          )
-        ) : null}
-        {window.innerWidth < 1000 ? (
-          !loading ? (
+      );
+    return (
       <>
-              <div className="mobile-home d-flex flex-column">
+        <>
+          <div
+            className={
+              (this.props.status && mobile ? "mobile-home" : "home") +
+              " d-flex flex-column"
+            }
+          >
             <Navbar page={"home"} />
             {homeData.map((item, i) => (
               <Identifier item={item} key={i} />
             ))}
           </div>
+          {window.innerWidth > 1000 ? <Footer /> : null}
         </>
-          ) : (
-            <div
-              className="d-flex justify-content-center align-items-center"
-              style={{ height: "100vh", width: "100vw" }}
-            >
-              <Loader />
-            </div>
-          )
-        ) : null}
       </>
     );
   }
@@ -144,7 +131,7 @@ const Identifier = (props) => {
           />
         ) : null
       ) : null}
-      {props.item.type === "search" && window.innerWidth > 1000 ? (
+      {props.item.type === "search" ? (
         <HomeSearch height={props.item.height} data={props.item.data} />
       ) : null}
       {props.item.type === "membership" && window.innerWidth > 1000 ? (

src/views/MyBooks/index.js

@@ -27,7 +27,8 @@ const fontSize = {
 
 class MyBooks extends React.Component {
   componentDidMount() {
-    this.props.getList();
+    console.log(this.props);
+    //  this.props.getList();
     window.scrollTo(0, 0);
   }
 
@@ -109,7 +110,7 @@ class MyBooks extends React.Component {
 
 export default connect(
   (state) => ({
-    list: state.userProduct.mylist,
+    list: state.userProduct.mylist || [],
     checkEmpty: state.userProduct.checkEmpty,
     // status: state.user.status,
   }),

src/views/Products/Product/index.js

@@ -29,8 +29,8 @@ export default class Product extends Component {
     return (
       <>
         {window.innerWidth < 1000 ? (
-          <div
-            //   to={`/products/physical/${product.id}`}
+          <Link
+            to={`/products/physical/${product.id}`}
             className="mobile-products-product d-flex flex-column"
           >
             <img
@@ -41,8 +41,8 @@ export default class Product extends Component {
               <h1 style={{ fontSize: fontSize.mobile.h1 }}>{product.name}</h1>
             </div>
             <div className="mobile-products-product__links d-flex mt-2">
-              <Link
-                to={`/products/physical/${product.id}`}
+              <div
+                // to={`/products/physical/${product.id}`}
                 style={{ fontSize: fontSize.mobile.a }}
                 className="mobile-products-product__links--physical d-flex justify-content-between align-items-center"
               >
@@ -50,7 +50,7 @@ export default class Product extends Component {
                 <span style={{ fontSize: fontSize.mobile.h2 }}>
                   {product.product[1].price} تومان
                 </span>
-              </Link>
+              </div>
               <a
                 href="#"
                 // to={`/products/digital/${product.id}`}
@@ -63,7 +63,7 @@ export default class Product extends Component {
                 </span>
               </a>
             </div>
-          </div>
+          </Link>
         ) : null}
         {window.innerWidth > 1000 ? (
           <article className="products-product d-flex flex-column align-items-center">

src/views/Products/Product/index.scss

@@ -98,7 +98,8 @@
       width: 80%;
       margin: 10px auto;
       justify-content: space-between;
-      a {
+      a,
+      div {
         width: 48%;
         padding: 5px 3px;
         border-radius: 7px;
@@ -142,7 +143,8 @@
         margin: 0px;
         text-align: center;
       }
-      a {
+      a,
+      div {
         width: 48%;
         padding: 5px 3px;
         border-radius: 7px;
@@ -163,7 +165,8 @@
       margin: 10px auto;
       flex-direction: column;
 
-      a {
+      a,
+      div {
         width: 100%;
         padding: 10px 5px;
         border-radius: 7px;
@@ -206,7 +209,8 @@
         color: #4d4d4d;
         letter-spacing: -1px;
       }
-      a {
+      a,
+      div {
         width: 48%;
         padding: 5px 3px;
         border-radius: 7px;
@@ -227,7 +231,8 @@
       margin: 10px auto;
       flex-direction: column;
 
-      a {
+      a,
+      div {
         width: 100%;
         padding: 10px 5px;
         border-radius: 7px;

src/views/QRScan/index.js

@@ -93,7 +93,7 @@ class QRScan extends Component {
         {window.innerWidth < 1000 ? (
           <>
             <div className="mobile-qr-scan d-flex flex-column">
-              <Navbar page="home" />
+              <Navbar page="qr-scan" />
               {/* <div className="mobile-qr-scan__back d-flex">
                 <Link to="/">بازگشت</Link>
               </div> */}