reza added some changes

master
RezaAshrafi77 3 years ago
parent 06543d34bf
commit 1d4a139246
  1. 1
      src/AppRouter.js
  2. 8
      src/Redux/actions/user.js
  3. 5
      src/Redux/proxy.js
  4. 17
      src/Redux/reducers/qr.js
  5. 26
      src/Redux/reducers/user.js
  6. 2
      src/views/AR/index.scss
  7. 69
      src/views/About/index.scss
  8. 7
      src/views/Auth/Login/Cellphone/index.scss
  9. 49
      src/views/Auth/Login/Code/index.js
  10. 32
      src/views/Auth/Login/Code/index.scss
  11. 29
      src/views/Auth/Login/Timer/index.js
  12. 2
      src/views/Auth/Login/index.js
  13. 7
      src/views/Auth/Profile/index.js
  14. 2
      src/views/Auth/index.scss
  15. 34
      src/views/Cart/Discount/index.js
  16. 29
      src/views/Cart/index.scss
  17. 49
      src/views/Contact/Select/index.js
  18. 4
      src/views/Contact/index.js
  19. 11
      src/views/Contact/index.scss
  20. 2
      src/views/Faq/index.scss
  21. 25
      src/views/Home/Membership/Input/index.js
  22. 1
      src/views/Home/Membership/index.scss
  23. 24
      src/views/Home/Navbar/Mobile/index.scss
  24. 6
      src/views/Home/Navbar/index.scss
  25. 2
      src/views/Home/index.scss
  26. 20
      src/views/MyBooks/index.scss
  27. 4
      src/views/Product/index.js
  28. 2
      src/views/Product/index.scss
  29. 27
      src/views/Products/index.scss
  30. 111
      src/views/QR/index.js
  31. 20
      src/views/QR/index.scss
  32. 4
      src/views/QRScan/Scanner/index.js
  33. 3
      src/views/QRScan/index.scss

@ -102,6 +102,7 @@ class AppRouter extends Component {
export default connect( export default connect(
(state) => ({ (state) => ({
profile: state.user.status.profile || {}, profile: state.user.status.profile || {},
// status: state.user.status,
}), }),
{} {}
)(AppRouter); )(AppRouter);

@ -2,8 +2,16 @@ import proxy from "../proxy";
const user = { const user = {
otp: (data, history) => async (dispatch) => otp: (data, history) => async (dispatch) =>
await proxy.login("public/sendOTP", data, { history, dispatch }), await proxy.login("public/sendOTP", data, { history, dispatch }),
// otp:
// (data = {}) =>
// async (dispatch) =>
// dispatch({ type: "public/sendOTP", payload: data }),
otp_login: (data, history) => async (dispatch) => otp_login: (data, history) => async (dispatch) =>
await proxy.login("user/otp/login", data, { history, dispatch }), await proxy.login("user/otp/login", data, { history, dispatch }),
// otp_login:
// (data = {}) =>
// async (dispatch) =>
// dispatch({ type: "user/otp/login", payload: data }),
register: (data, history) => async (dispatch) => register: (data, history) => async (dispatch) =>
await proxy.login("user/register", data, { history, dispatch }), await proxy.login("user/register", data, { history, dispatch }),
switchRole: (data, history) => async (dispatch) => switchRole: (data, history) => async (dispatch) =>

@ -1,15 +1,14 @@
import { ApiConfig } from "./../constants/defaultValues"; import { ApiConfig } from "./../constants/defaultValues";
import axios from "axios"; import axios from "axios";
let { baseUrl, apiKey } = ApiConfig; let { baseUrl } = ApiConfig;
let access = window.localStorage.getItem("access"); let access = window.localStorage.getItem("access");
baseUrl = baseUrl + "/"; baseUrl = baseUrl + "/";
const baseUrl2 = "https://dnvn.ir/api/v1";
const Axios = axios.create({ const Axios = axios.create({
withCredentials: true, withCredentials: true,
validateStatus: null, validateStatus: null,
baseURL: baseUrl, baseURL: baseUrl,
headers: access ? { Authorization: `Bearer ${access}` } : {}, //headers: access ? { Authorization: `Bearer ${access}` } : {},
}); });
class Proxy { class Proxy {
get = async (url, params, opt = {}) => get = async (url, params, opt = {}) =>

@ -56,7 +56,22 @@ export default function qr(state = initialState, action) {
return { return {
...state, ...state,
loading: false, loading: false,
list: action.payload === "Zist10-13" ? [] : null, list:
action.payload === "Zist10-13"
? [
{
type: "pdf",
title: "فایل پی دی اف ارائه درس آتشفشان",
link: "",
},
]
: [
{
type: "h1",
text: "صفحهای یافت نشد",
file: null,
},
],
error: null, error: null,
}; };
///////////// /////////////

@ -1,4 +1,4 @@
import proxy from '../proxy'; import proxy from "../proxy";
const initialState = { const initialState = {
status: proxy.status(), status: proxy.status(),
loading: false, loading: false,
@ -10,25 +10,27 @@ const initialState = {
export default function user(state = initialState, action) { export default function user(state = initialState, action) {
let { type, data } = action; let { type, data } = action;
switch (type) { switch (type) {
case 'user/login': case "user/login":
case 'user/register': case "user/register":
case 'user/otp/login': case "user/switchRole":
case 'user/switchRole': case "public/sendOTP":
case "user/otp/login":
return { ...state, loading: false, status: data, error: null }; return { ...state, loading: false, status: data, error: null };
case 'user/logout': case "user/logout":
return { ...state, loading: false, status: proxy.status(), error: null }; return { ...state, loading: false, status: proxy.status(), error: null };
case 'user/getUserRole': case "user/getUserRole":
return { ...state, loading: false, userRoles: data, error: null }; return { ...state, loading: false, userRoles: data, error: null };
case 'user/list': case "user/list":
return { ...state, loading: false, list: data, error: null }; return { ...state, loading: false, list: data, error: null };
case 'user/domains': case "user/domains":
return { ...state, loading: false, domains: data, error: null }; return { ...state, loading: false, domains: data, error: null };
case 'mothers/list': case "mothers/list":
return { ...state, loading: false, mothers: data, error: null }; return { ...state, loading: false, mothers: data, error: null };
///////////// /////////////
case 'loading': case "loading":
return { ...state, loading: true }; return { ...state, loading: true };
case 'error': case "error":
return { ...state, loading: false, error: data.message }; return { ...state, loading: false, error: data.message };
default: default:
return state; return state;

@ -4,7 +4,7 @@
margin: 0px auto; margin: 0px auto;
padding: 0px 10px 40px; padding: 0px 10px 40px;
direction: rtl; direction: rtl;
padding-top: 90px; padding-top: 70px;
overflow-x: hidden; overflow-x: hidden;
} }

@ -19,7 +19,7 @@
display: inline; display: inline;
letter-spacing: -2px; letter-spacing: -2px;
font-family: numeralBold; font-family: numeralBold;
background-color: #00CC69; background-color: #00cc69;
color: white; color: white;
} }
p { p {
@ -35,7 +35,7 @@
h2 { h2 {
display: inline; display: inline;
font-family: numeralBold; font-family: numeralBold;
background-color: #00CC69; background-color: #00cc69;
color: white; color: white;
} }
ul { ul {
@ -45,7 +45,7 @@
margin-top: 5px; margin-top: 5px;
li { li {
display: inline; display: inline;
border-bottom: 2px solid #00CC69; border-bottom: 2px solid #00cc69;
font-family: numeralLight; font-family: numeralLight;
color: #6d6d6d; color: #6d6d6d;
} }
@ -56,34 +56,31 @@
width: 60%; width: 60%;
height: 100%; height: 100%;
position: relative; position: relative;
& img{ & img {
position: absolute; position: absolute;
} }
&__1{ &__1 {
top:0px; top: 0px;
left: 100px; left: 100px;
z-index: 100; z-index: 100;
height: 470px; height: 470px;
width: 470px width: 470px;
} }
&__2{ &__2 {
left: 430px; left: 430px;
bottom: 80px; bottom: 80px;
z-index: 150; z-index: 150;
height: 235px; height: 235px;
width: 235px; width: 235px;
} }
&__3{ &__3 {
bottom: 0px; bottom: 0px;
left: 310px; left: 310px;
z-index: 200; z-index: 200;
height: 200px; height: 200px;
width: 200px; width: 200px;
} }
&__4{ &__4 {
top: 50px; top: 50px;
left: 0px; left: 0px;
z-index: 150; z-index: 150;
@ -101,7 +98,7 @@
&--right { &--right {
width: 48%; width: 48%;
height: 100%; height: 100%;
& img{ & img {
width: 100%; width: 100%;
} }
} }
@ -114,7 +111,7 @@
h1 { h1 {
display: inline; display: inline;
font-family: numeralBold; font-family: numeralBold;
background-color: #00CC69; background-color: #00cc69;
color: white; color: white;
} }
ul { ul {
@ -133,20 +130,20 @@
} }
} }
.mobile-about{ .mobile-about {
width: 100vw; width: 100vw;
max-width: 650px; max-width: 650px;
margin: 0px auto; margin: 0px auto;
padding : 0px 10px 40px; padding: 0px 10px 40px;
direction: rtl; direction: rtl;
padding-top: 90px; padding-top: 70px;
overflow-x: hidden; overflow-x: hidden;
&__fury{ &__fury {
h1 { h1 {
display: inline; display: inline;
letter-spacing: -2px; letter-spacing: -2px;
font-family: numeralBold; font-family: numeralBold;
background-color: #00CC69; background-color: #00cc69;
color: white; color: white;
} }
p { p {
@ -157,25 +154,23 @@
letter-spacing: -1px; letter-spacing: -1px;
} }
} }
&__images{ &__images {
position: relative; position: relative;
height: 330px; height: 330px;
width: 100%; width: 100%;
& img{ & img {
position: absolute; position: absolute;
} }
&--1{ &--1 {
top:0px; top: 0px;
left: calc(100vw / 8); left: calc(100vw / 8);
z-index: 100; z-index: 100;
height: calc(100vw - 100px); height: calc(100vw - 100px);
width: calc(100vw - 100px); width: calc(100vw - 100px);
max-width: 275px; max-width: 275px;
max-height: 275px; max-height: 275px;
} }
&--2{ &--2 {
right: -20px; right: -20px;
bottom: 70px; bottom: 70px;
z-index: 150; z-index: 150;
@ -183,9 +178,8 @@
width: calc(100vw / 2.5); width: calc(100vw / 2.5);
max-width: 150px; max-width: 150px;
max-height: 150px; max-height: 150px;
} }
&--3{ &--3 {
bottom: -10px; bottom: -10px;
right: -10px; right: -10px;
z-index: 200; z-index: 200;
@ -193,9 +187,8 @@
width: calc(100vw / 3); width: calc(100vw / 3);
max-width: 125px; max-width: 125px;
max-height: 125px; max-height: 125px;
} }
&--4{ &--4 {
top: 50px; top: 50px;
left: -20px; left: -20px;
z-index: 150; z-index: 150;
@ -205,12 +198,12 @@
max-height: 125px; max-height: 125px;
} }
} }
&__keys{ &__keys {
transform : translateY(-40px); transform: translateY(-40px);
h2 { h2 {
display: inline; display: inline;
font-family: numeralBold; font-family: numeralBold;
background-color: #00CC69; background-color: #00cc69;
color: white; color: white;
} }
ul { ul {
@ -220,23 +213,23 @@
margin-top: 5px; margin-top: 5px;
li { li {
display: inline; display: inline;
border-bottom: 2px solid #00CC69; border-bottom: 2px solid #00cc69;
font-family: numeralLight; font-family: numeralLight;
color: #6d6d6d; color: #6d6d6d;
} }
} }
} }
&__video{ &__video {
img { img {
width: 100%; width: 100%;
} }
} }
&__advantages{ &__advantages {
margin-top: 30px; margin-top: 30px;
h1 { h1 {
display: inline; display: inline;
font-family: numeralBold; font-family: numeralBold;
background-color: #00CC69; background-color: #00cc69;
color: white; color: white;
// margin-bottom: 20px; // margin-bottom: 20px;
} }

@ -89,6 +89,7 @@
max-width: 500px; max-width: 500px;
margin: 0px auto; margin: 0px auto;
padding: 10px; padding: 10px;
position: relative;
img { img {
margin-bottom: 30px; margin-bottom: 30px;
position: relative; position: relative;
@ -120,7 +121,7 @@
text-align: right; text-align: right;
position: absolute; position: absolute;
left: 65px; left: 65px;
top: 7px; top: 8px;
direction: ltr; direction: ltr;
font-family: numeralLight; font-family: numeralLight;
color: #a5a5a5; color: #a5a5a5;
@ -135,7 +136,7 @@
text-align: left; text-align: left;
background-color: #f2f2f2; background-color: #f2f2f2;
border: none; border: none;
padding: 0px 5px 0px 83px; padding: 0px 5px 0px 81px;
border-radius: 5px; border-radius: 5px;
&:focus { &:focus {
outline: 0px; outline: 0px;
@ -153,7 +154,7 @@
} }
} }
&__footer { &__footer {
position: fixed; position: absolute;
bottom: 40px; bottom: 40px;
div { div {
font-family: numeralLight; font-family: numeralLight;

@ -1,4 +1,5 @@
import React, { Component } from "react"; import React, { Component } from "react";
import { Link } from "react-router-dom";
import Timer from "../Timer/index"; import Timer from "../Timer/index";
import logo from "../../../../assets/icons/logo.png"; import logo from "../../../../assets/icons/logo.png";
@ -7,6 +8,7 @@ import pic from "../../../../assets/images/pic.png";
import "./index.scss"; import "./index.scss";
const maxDesktopSize = 1250; const maxDesktopSize = 1250;
const maxMobileSize = 550;
const fontSize = { const fontSize = {
desktop: { desktop: {
@ -14,6 +16,13 @@ const fontSize = {
button: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 85, button: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 85,
div: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 95, div: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 95,
}, },
mobile: {
h1: window.innerWidth > maxMobileSize ? 24 : window.innerWidth / 13,
p: window.innerWidth > maxMobileSize ? 13 : window.innerWidth / 27,
input: window.innerWidth > maxMobileSize ? 20 : window.innerWidth / 85,
button: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 85,
div: window.innerWidth > maxMobileSize ? 12 : window.innerWidth / 30,
},
}; };
export default class Code extends Component { export default class Code extends Component {
constructor(props) { constructor(props) {
@ -87,10 +96,10 @@ export default class Code extends Component {
<div className="auth-code__box d-flex"> <div className="auth-code__box d-flex">
<div <div
style={{ width: "48%", height: "100%" }} style={{ width: "48%", height: "100%" }}
className="d-flex flex-column justify-content-center align-items-center" className="d-flex flex-column justify-content-center align-items-center p-5"
> >
<img src={logo} alt="دانوین" /> <img src={logo} alt="دانوین" />
<div className="auth-code__box--codes d-flex"> <div className="auth-code__box--codes d-flex justify-content-around">
<label htmlFor="code1"> <label htmlFor="code1">
<input <input
id="code1" id="code1"
@ -168,13 +177,14 @@ export default class Code extends Component {
ثبت ثبت
</button> </button>
{!this.state.resendStatus ? ( {!this.state.resendStatus ? (
<Timer seconds={10} parent={this} /> <Timer seconds={60} parent={this} />
) : ( ) : (
<div <div
style={{ style={{
color: "#A5A5A5", color: "#A5A5A5",
fontFamily: "numeralMedium", fontFamily: "numeralLight",
fontSize: fontSize.desktop.div, fontSize: fontSize.desktop.div,
cursor: "pointer",
}} }}
className="timer d-flex mt-4" className="timer d-flex mt-4"
onClick={() => this.setState({ resendStatus: false })} onClick={() => this.setState({ resendStatus: false })}
@ -185,8 +195,9 @@ export default class Code extends Component {
<div <div
style={{ style={{
color: "#A5A5A5", color: "#A5A5A5",
fontFamily: "numeralMedium", fontFamily: "numeralLight",
fontSize: fontSize.desktop.div, fontSize: fontSize.desktop.div,
cursor: "pointer",
}} }}
className="timer d-flex mt-2" className="timer d-flex mt-2"
onClick={() => onClick={() =>
@ -197,27 +208,27 @@ export default class Code extends Component {
</div> </div>
</div> </div>
<div style={{ width: "48%", height: "100%" }} className="d-flex"> <div style={{ width: "48%", height: "100%" }} className="d-flex">
<img {/* <img
src={pic} src={pic}
alt="عکس" alt="عکس"
style={{ width: "100%", height: "100%" }} style={{ width: "100%", height: "100%" }}
/> /> */}
</div> </div>
</div> </div>
</div> </div>
) : null} ) : null}
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<div className="mobile-auth-code d-flex flex-column"> <div className="mobile-auth-code d-flex flex-column p-3">
<img src={logo} alt="دانوین" /> <img src={logo} alt="دانوین" />
<div style={{ maxHeight: 60 }} className="d-flex flex-column mb-3"> <div style={{ width: "100%" }} className="d-flex flex-column mb-1">
<h1>دانوین</h1> <h1 style={{ fontSize: fontSize.mobile.h1 }}>دانوین</h1>
<p> <p style={{ fontSize: fontSize.mobile.p }}>
یک کد تائیدیه به شماره{" "} یک کد تائیدیه به شماره{" "}
<span>{this.props.parent.state.cellphone}</span> ارسال شد <br /> <span>{this.props.parent.state.cellphone}</span> ارسال شد <br />
آن را در قسمت زیر وارد کنید. آن را در قسمت زیر وارد کنید.
</p> </p>
</div> </div>
<div className="mobile-auth-code__codes d-flex"> <div className="mobile-auth-code__codes d-flex justify-content-around">
<label htmlFor="code1"> <label htmlFor="code1">
<input <input
id="code1" id="code1"
@ -290,10 +301,14 @@ export default class Code extends Component {
</div> </div>
<button>ثبت</button> <button>ثبت</button>
{!this.state.resendStatus ? ( {!this.state.resendStatus ? (
<Timer seconds={10} parent={this} /> <Timer seconds={60} parent={this} />
) : ( ) : (
<div <div
style={{ color: "#A5A5A5", fontFamily: "numeralLight" }} style={{
color: "#A5A5A5",
fontFamily: "numeralLight",
fontSize: fontSize.mobile.div,
}}
className="timer d-flex mt-4" className="timer d-flex mt-4"
onClick={() => this.setState({ resendStatus: false })} onClick={() => this.setState({ resendStatus: false })}
> >
@ -301,7 +316,11 @@ export default class Code extends Component {
</div> </div>
)} )}
<div <div
style={{ color: "#A5A5A5", fontFamily: "numeralLight" }} style={{
color: "#A5A5A5",
fontFamily: "numeralLight",
fontSize: fontSize.mobile.div,
}}
className="timer d-flex mt-2" className="timer d-flex mt-2"
onClick={() => onClick={() =>
this.props.parent.setState({ page: 0, cellphone: "" }) this.props.parent.setState({ page: 0, cellphone: "" })

@ -8,8 +8,15 @@
border-radius: 20px; border-radius: 20px;
justify-content: space-between; justify-content: space-between;
height: 80%; height: 80%;
background: url(../../../../assets/images/auth_bg.png);
background-position: -58px -60px;
background-size: calc(100% + 150px) calc(100% + 200px);
background-repeat: no-repeat;
height: 80%;
max-height: 600px;
img { img {
margin-bottom: 30px; margin-bottom: 30px;
width: 200px;
} }
button { button {
margin-top: 20px; margin-top: 20px;
@ -24,6 +31,9 @@
} }
&--codes { &--codes {
direction: ltr; direction: ltr;
width: 100%;
max-width: 300px;
position: relative;
input { input {
max-width: 60px; max-width: 60px;
max-height: 60px; max-height: 60px;
@ -55,52 +65,50 @@
align-items: center; align-items: center;
direction: ltr; direction: ltr;
position: relative; position: relative;
max-width: 360px; // max-width: 360px;
margin: 0px auto; margin: 0px auto;
img { img {
margin-bottom: 30px; margin-bottom: 30px;
position: relative; position: relative;
bottom: 40px;
} }
h1 { h1 {
width: 100%;
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 15);
color: #6f7074; color: #6f7074;
position: relative; position: relative;
bottom: 40px;
} }
p { p {
font-family: numeralLight; font-family: numeralLight;
font-size: calc(100vw / 25);
color: #6f7074; color: #6f7074;
letter-spacing: -1px;
position: relative; position: relative;
bottom: 40px;
} }
button { button {
margin-top: 20px; margin-top: 20px;
width: 100%; width: 100%;
max-width: 300px;
border: 0px; border: 0px;
font-family: numeralMedium; font-family: numeralLight;
background-color: #6cbe44; background-color: #6cbe44;
color: white; color: white;
border-radius: 7px; border-radius: 7px;
padding: 8px; padding: 8px;
font-size: calc(100vw / 20); margin-top: 30px;
}
div {
letter-spacing: -1px;
color: #6cbe44;
} }
&__codes { &__codes {
direction: ltr; direction: ltr;
width: 100%;
input { input {
max-width: 60px; max-width: 60px;
max-height: 60px; max-height: 60px;
background-color: #f2f2f2; background-color: #f2f2f2;
border: 0px; border: 0px;
margin: 0px 10px; margin: 0px;
color: #6f7074; color: #6f7074;
text-align: center; text-align: center;
direction: ltr; direction: ltr;
font-size: calc(100vw / 15);
border-radius: 5px; border-radius: 5px;
padding: 10px 15px; padding: 10px 15px;
&:focus { &:focus {

@ -2,11 +2,15 @@ import { Component } from "react";
import "./index.css"; import "./index.css";
const maxDesktopSize = 1250; const maxDesktopSize = 1250;
const maxMobileSize = 550;
const fontSize = { const fontSize = {
desktop: { desktop: {
div: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 95, div: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 95,
}, },
mobile: {
div: window.innerWidth > maxMobileSize ? 12 : window.innerWidth / 30,
},
}; };
export default class Timer extends Component { export default class Timer extends Component {
constructor(props) { constructor(props) {
@ -87,11 +91,30 @@ export default class Timer extends Component {
) : null} ) : null}
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<div className="timer d-flex mt-4"> <div className="timer d-flex mt-4">
<div style={{ color: "#a5a5a5", marginLeft: 5 }}> <div
style={{
color: "#a5a5a5",
marginLeft: 5,
fontSize: fontSize.mobile.div,
}}
>
زمان باقیمانده تا انقضای کد زمان باقیمانده تا انقضای کد
</div> </div>
<div>{this.state.time.s}</div>: <div
<div>{this.state.time.m + this.state.time.h * 60}</div> style={{
fontSize: fontSize.mobile.div,
}}
>
{this.state.time.s}
</div>
:
<div
style={{
fontSize: fontSize.mobile.div,
}}
>
{this.state.time.m + this.state.time.h * 60}
</div>
</div> </div>
) : null} ) : null}
</> </>

@ -26,6 +26,8 @@ class Login extends Component {
userToken: "1", userToken: "1",
applicationToken: "11", applicationToken: "11",
}); });
localStorage.setItem("refresh", "sff234r324rf423dfsdfsaf");
localStorage.setItem("userData", "srrfsadf");
} }
resend = () => { resend = () => {

@ -37,7 +37,7 @@ class Profile extends Component {
username: "", username: "",
address: "", address: "",
gender: "", gender: "",
userRoleId: "", userRoleId: "معلم",
nationalId: "", nationalId: "",
provinceId: "", provinceId: "",
cityId: "", cityId: "",
@ -66,9 +66,8 @@ class Profile extends Component {
componentDidMount() { componentDidMount() {
const { getProfile, profile } = this.props; const { getProfile, profile } = this.props;
// if (!profile) {
// getProfile(); getProfile();
// }
} }
onSubmit = (e) => { onSubmit = (e) => {

@ -1,5 +1,7 @@
.auth { .auth {
width: 100%; width: 100%;
height: 100vh;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
min-height: 450px;
} }

@ -1,5 +1,5 @@
import React from 'react'; import React from "react";
import './index.scss'; import "./index.scss";
const maxDesktopSize = 1250; const maxDesktopSize = 1250;
const maxMobileSize = 550; const maxMobileSize = 550;
@ -7,35 +7,35 @@ const maxMobileSize = 550;
const fontSize = { const fontSize = {
desktop: { desktop: {
h2: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 55, h2: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 55,
input : window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 75, input: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 75,
button : window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 75, button: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 75,
p: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 90, p: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 90,
}, },
mobile: { mobile: {
h2: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 24, h2: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 24,
p: window.innerWidth > maxMobileSize ? 12 : window.innerWidth / 32, p: window.innerWidth > maxMobileSize ? 12 : window.innerWidth / 32,
input: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 20, input: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 20,
button: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 20, button: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 25,
}, },
}; };
const DiscoutCode = (props) => { const DiscoutCode = (props) => {
return ( return (
<> <>
{window.innerWidth > 1000 ? ( {window.innerWidth > 1000 ? (
<div className="discount-code d-flex flex-column"> <div className="discount-code d-flex flex-column">
<h2 style={{ fontSize: fontSize.desktop.h2 }}>کد تخفیف</h2> <h2 style={{ fontSize: fontSize.desktop.h2 }}>کد تخفیف</h2>
<p style={{ fontSize: fontSize.desktop.p }}> <p style={{ fontSize: fontSize.desktop.p }}>
اگر کد تخفیفی دارید آن را در کادر زیر وارد نمائید و دکمه ثبت کد را اگر کد تخفیفی دارید آن را در کادر زیر وارد نمائید و دکمه ثبت کد را
بزنید بزنید
</p> </p>
<div className="discount-code__box d-flex align-items-center"> <div className="discount-code__box d-flex align-items-center">
<input style={{ fontSize: fontSize.desktop.input }} type="text" /> <input style={{ fontSize: fontSize.desktop.input }} type="text" />
<button style={{ fontSize: fontSize.desktop.button }}>ثبت کد</button> <button style={{ fontSize: fontSize.desktop.button }}>
ثبت کد
</button>
</div>
</div> </div>
</div>
) : null} ) : null}
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<div className="mobile-discount-code d-flex flex-column"> <div className="mobile-discount-code d-flex flex-column">
@ -46,7 +46,7 @@ const DiscoutCode = (props) => {
</p> </p>
<div className="mobile-discount-code__box d-flex align-items-center"> <div className="mobile-discount-code__box d-flex align-items-center">
<input style={{ fontSize: fontSize.mobile.input }} type="text" /> <input style={{ fontSize: fontSize.mobile.input }} type="text" />
<button style={{ fontSize: fontSize.desktop.button }}>ثبت کد</button> <button style={{ fontSize: fontSize.mobile.button }}>ثبت کد</button>
</div> </div>
</div> </div>
) : null} ) : null}

@ -5,24 +5,24 @@
padding: 0px; padding: 0px;
font-family: numeralLight; font-family: numeralLight;
padding-top: 100px; padding-top: 100px;
&__totalPrice{ &__totalPrice {
padding: 20px 0px; padding: 20px 0px;
border-bottom: 1px dotted #A5A5A5; border-bottom: 1px dotted #a5a5a5;
padding-bottom: 20px; padding-bottom: 20px;
h3{ h3 {
font-family: numeralLight; font-family: numeralLight;
color: #00CC69; color: #00cc69;
margin: 0px; margin: 0px;
} }
div{ div {
margin-right: 20px; margin-right: 20px;
strong{ strong {
font-family: numeralBold; font-family: numeralBold;
color: #4D4D4F; color: #4d4d4f;
margin-left: 5px; margin-left: 5px;
} }
span{ span {
font-family: numeralLight; font-family: numeralLight;
color: #848484; color: #848484;
} }
@ -31,7 +31,6 @@
&__right { &__right {
flex: 4; flex: 4;
padding: 10px 0px 0px; padding: 10px 0px 0px;
} }
&__left { &__left {
flex: 1.2; flex: 1.2;
@ -50,7 +49,7 @@
letter-spacing: -1px; letter-spacing: -1px;
} }
} }
&--submit{ &--submit {
justify-self: flex-end; justify-self: flex-end;
padding: 12px; padding: 12px;
width: 100%; width: 100%;
@ -70,10 +69,10 @@
margin: 0px auto; margin: 0px auto;
padding: 0px 10px 40px; padding: 0px 10px 40px;
direction: rtl; direction: rtl;
padding-top: 60px; padding-top: 70px;
overflow-x: hidden; overflow-x: hidden;
font-family: numeralLight; font-family: numeralLight;
&__submit{ &__submit {
justify-self: flex-end; justify-self: flex-end;
padding: 12px; padding: 12px;
width: 100%; width: 100%;
@ -90,7 +89,7 @@
} }
&__payMethods { &__payMethods {
border-bottom: 1px dotted #A5A5A5; border-bottom: 1px dotted #a5a5a5;
margin-top: 20px; margin-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;
h2 { h2 {
@ -102,9 +101,5 @@
color: #a5a5a5; color: #a5a5a5;
letter-spacing: -1px; letter-spacing: -1px;
} }
} }
} }

@ -1,40 +1,25 @@
import React from 'react'; import React from "react";
import { makeStyles, withStyles } from '@material-ui/core/styles'; import { makeStyles, withStyles } from "@material-ui/core/styles";
import FormControl from '@material-ui/core/FormControl'; import FormControl from "@material-ui/core/FormControl";
import NativeSelect from '@material-ui/core/NativeSelect'; import NativeSelect from "@material-ui/core/NativeSelect";
import InputBase from '@material-ui/core/InputBase'; import InputBase from "@material-ui/core/InputBase";
const BootstrapInput = withStyles((theme) => ({ const BootstrapInput = withStyles((theme) => ({
root: { root: {
'label + &': { "label + &": {
marginTop: theme.spacing(3), marginTop: theme.spacing(3),
}, },
}, },
input: { input: {
width : 350, width: 350,
borderRadius: 4, borderRadius: 4,
position: 'relative', position: "relative",
backgroundColor: theme.palette.background.paper, backgroundColor: theme.palette.background.paper,
border: '0px solid #cecece', border: "0px solid #cecece",
fontSize: 16, fontSize: 14,
padding: '10px 26px 10px 12px', padding: "10px 26px 10px 12px",
transition: theme.transitions.create(['border-color', 'box-shadow']), transition: theme.transitions.create(["border-color", "box-shadow"]),
// Use the system font instead of the default Roboto font. // Use the system font instead of the default Roboto font.
fontFamily: [
'-apple-system',
'BlinkMacSystemFont',
'"Segoe UI"',
'Roboto',
'"Helvetica Neue"',
'Arial',
'sans-serif',
'"Apple Color Emoji"',
'"Segoe UI Emoji"',
'"Segoe UI Symbol"',
].join(','),
'&:focus': {
borderRadius: 4,
},
}, },
}))(InputBase); }))(InputBase);
@ -47,7 +32,7 @@ const useStyles = makeStyles((theme) => ({
export default function CustomizedSelects(props) { export default function CustomizedSelects(props) {
const classes = useStyles(); const classes = useStyles();
const [age, setAge] = React.useState(''); const [age, setAge] = React.useState("");
const handleChange = (event) => { const handleChange = (event) => {
setAge(event.target.value); setAge(event.target.value);
}; };
@ -60,11 +45,9 @@ export default function CustomizedSelects(props) {
onChange={handleChange} onChange={handleChange}
input={<BootstrapInput />} input={<BootstrapInput />}
> >
{ {props.options.map((item) => (
props.options.map(item => ( <option value={item}>{item}</option>
<option value={item}>{item}</option> ))}
))
}
</NativeSelect> </NativeSelect>
</FormControl> </FormControl>
</div> </div>

@ -21,8 +21,8 @@ const fontSize = {
}, },
mobile: { mobile: {
h1: window.innerWidth > maxMobileSize ? 25 : window.innerWidth / 16, h1: window.innerWidth > maxMobileSize ? 25 : window.innerWidth / 16,
p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 28, p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 34,
span: window.innerWidth > maxMobileSize ? 15 : window.innerWidth / 28, span: window.innerWidth > maxMobileSize ? 15 : window.innerWidth / 32,
}, },
}; };
export default class Contact extends Component { export default class Contact extends Component {

@ -163,7 +163,8 @@
padding: 0px 10px; padding: 0px 10px;
direction: rtl; direction: rtl;
overflow-x: hidden; overflow-x: hidden;
padding-top: 90px; padding-top: 70px;
padding-bottom: 50px;
&__form { &__form {
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
@ -200,7 +201,9 @@
right: -5px; right: -5px;
top: -8px; top: -8px;
transform: translate(0px, 0px) scale(0.75) !important; transform: translate(0px, 0px) scale(0.75) !important;
padding-right: 15px !important; padding-right: 0px !important;
width: fit-content;
padding: 0px 6px !important;
} }
label { label {
@ -209,6 +212,8 @@
text-align: center; text-align: center;
color: #797979 !important; color: #797979 !important;
letter-spacing: -1px; letter-spacing: -1px;
font-family: numeralLight !important;
font-size: 14px;
} }
.Mui-focused { .Mui-focused {
color: rgba(0, 0, 0, 0.54) !important; color: rgba(0, 0, 0, 0.54) !important;
@ -222,7 +227,6 @@
p { p {
font-family: numeralLight; font-family: numeralLight;
color: #6f7074; color: #6f7074;
letter-spacing: -1px;
} }
button { button {
@ -249,6 +253,7 @@
border: 1px solid #c4c4c5; border: 1px solid #c4c4c5;
padding: 10px 8px; padding: 10px 8px;
color: #6f7074; color: #6f7074;
font-size: 14px;
&::placeholder { &::placeholder {
color: #797979; color: #797979;
} }

@ -64,7 +64,7 @@
padding: 0px 10px; padding: 0px 10px;
direction: rtl; direction: rtl;
overflow-x: hidden; overflow-x: hidden;
padding-top: 90px; padding-top: 70px;
&__header { &__header {
margin-top: 30px; margin-top: 30px;
width: 100%; width: 100%;

@ -1,14 +1,16 @@
import React from 'react'; import React from "react";
import TextField from '@material-ui/core/TextField'; import TextField from "@material-ui/core/TextField";
import { makeStyles } from '@material-ui/core/styles'; import { makeStyles } from "@material-ui/core/styles";
const useStyles = makeStyles((theme) => ({ const useStyles = makeStyles((theme) => ({
root: { root: {
'& .MuiTextField-root': { "& .MuiTextField-root": {
width: "200px",
width: '200px', position: "relative",
position : 'relative', marginRight: 30,
marginRight : 10, },
input: {
border: "0px",
}, },
}, },
})); }));
@ -19,7 +21,12 @@ export default function FormPropsTextFields(props) {
return ( return (
<form className={classes.root} noValidate autoComplete="off"> <form className={classes.root} noValidate autoComplete="off">
<div> <div>
<TextField id="outlined-basic" name={props.name} label={props.label} variant="outlined" /> <TextField
id="outlined-basic"
name={props.name}
label={props.label}
variant="outlined"
/>
</div> </div>
</form> </form>
); );

@ -41,6 +41,7 @@
right: 4px; right: 4px;
top: 12px; top: 12px;
transform: translate(0px, 0px) scale(1) !important; transform: translate(0px, 0px) scale(1) !important;
border: 0px !important;
} }
.MuiInputLabel-shrink { .MuiInputLabel-shrink {
display: inline; display: inline;

@ -1,26 +1,26 @@
.mobile-navbar{ .mobile-navbar {
width: 100%; width: 100%;
position: fixed; position: fixed;
top : 0px; top: 0px;
left : 0px; left: 0px;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
background-color: white; background-color: white;
z-index: 400; z-index: 400;
padding: 15px 10px; padding: 15px 10px;
&__menu{ &__menu {
img{ img {
width : calc(100vw / 12); width: 25px;
} }
} }
&__logo{ &__logo {
img{ img {
width: calc(100vw / 4); width: 80px;
} }
} }
&__left{ &__left {
img{ img {
width : calc(100vw / 15); width: 25px;
} }
} }
} }

@ -1,11 +1,11 @@
.navbar{ .navbar {
width: 100%; width: 100%;
max-width: 1250px; max-width: 1250px;
position: fixed !important; position: fixed !important;
top: 0px !important; top: 0px !important;
overflow-x: hidden; overflow-x: hidden;
background-color:white !important; background-color: white !important;
z-index: 200; z-index: 300;
// margin: 0px auto !important; // margin: 0px auto !important;
} }

@ -14,5 +14,5 @@
padding: 0px 10px; padding: 0px 10px;
direction: rtl; direction: rtl;
overflow-x: hidden; overflow-x: hidden;
padding-top: 90px; padding-top: 70px;
} }

@ -1,14 +1,14 @@
.mybooks{ .mybooks {
width: 100vw; width: 100vw;
max-width: 1250px; max-width: 1250px;
margin: 0px auto; margin: 0px auto;
padding : 0px 10px; padding: 0px 10px;
direction: rtl; direction: rtl;
min-height: calc(100vh - 288px); min-height: calc(100vh - 288px);
padding-top: 100px; padding-top: 100px;
} }
.mobile-mybooks{ .mobile-mybooks {
width: 100vw; width: 100vw;
max-width: 600px; max-width: 600px;
margin: 0px auto; margin: 0px auto;
@ -16,27 +16,27 @@
direction: rtl; direction: rtl;
overflow-x: hidden; overflow-x: hidden;
padding-top: 70px; padding-top: 70px;
h1{ h1 {
padding: 0px 10px; padding: 0px 10px;
font-family: numeralBold; font-family: numeralBold;
color: #6F7074; color: #6f7074;
margin-bottom: 10px; margin-bottom: 10px;
} }
&__item{ &__item {
background-color: #F2F2F2; background-color: #f2f2f2;
width: calc(100vw / 2 - 15px); width: calc(100vw / 2 - 15px);
margin: 5px; margin: 5px;
border-top-left-radius: 30px; border-top-left-radius: 30px;
border-top-right-radius: 30px; border-top-right-radius: 30px;
margin-bottom: 20px; margin-bottom: 20px;
& img{ & img {
width: 100%; width: 100%;
height: calc(100vh / 3.5); height: calc(100vh / 3.5);
border-radius: 30px; border-radius: 30px;
max-height: 200px; max-height: 200px;
margin-bottom: 10px; margin-bottom: 10px;
} }
&--buttons{ &--buttons {
padding: 5px 9px; padding: 5px 9px;
a { a {
text-decoration: none; text-decoration: none;
@ -50,7 +50,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
img{ img {
position: absolute; position: absolute;
top: calc(50% - 8px); top: calc(50% - 8px);
left: 5px; left: 5px;

@ -65,9 +65,9 @@ export default class Product extends Component {
</header> </header>
<div className="product__comments d-flex flex-column"> <div className="product__comments d-flex flex-column">
<div className="d-flex justify-content-between"> <div className="d-flex justify-content-between">
<h1 style={{ fontSize: fontSize.desktop.h1 }}> <h3 style={{ fontSize: fontSize.desktop.h1 }}>
نظرات خریداران نظرات خریداران
</h1> </h3>
<button> <button>
ارسال نظر ارسال نظر
<img src={send_comment} alt="ارسال نظر" /> <img src={send_comment} alt="ارسال نظر" />

@ -4,7 +4,7 @@
margin: 0px auto; margin: 0px auto;
padding: 0px 10px 40px; padding: 0px 10px 40px;
direction: rtl; direction: rtl;
padding-top: 90px; padding-top: 70px;
overflow-x: hidden; overflow-x: hidden;
&__header { &__header {
width: 100%; width: 100%;

@ -1,44 +1,43 @@
.products{ .products {
width: 100vw; width: 100vw;
max-width: 1250px; max-width: 1250px;
margin: 0px auto; margin: 0px auto;
padding : 0px 10px; padding: 0px 10px;
direction: rtl; direction: rtl;
min-height: calc(100vh - 288px); min-height: calc(100vh - 288px);
padding-top: 100px; padding-top: 100px;
&__body{ &__body {
margin-top: 20px; margin-top: 20px;
&--left{ &--left {
flex: 4; flex: 4;
padding-right: 20px; padding-right: 20px;
} }
} }
} }
.mobile-products {
.mobile-products{
width: 100vw; width: 100vw;
max-width: 600px; max-width: 600px;
margin: 0px auto; margin: 0px auto;
padding: 0px; padding: 0px;
direction: rtl; direction: rtl;
overflow-x: hidden; overflow-x: hidden;
padding-top: 90px; padding-top: 70px;
&__filters{ &__filters {
width: 100%; width: 100%;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding : 0px 10px; padding: 0px 10px;
.MuiNativeSelect-icon{ .MuiNativeSelect-icon {
display: none; display: none;
} }
.MuiNativeSelect-select.MuiNativeSelect-select{ .MuiNativeSelect-select.MuiNativeSelect-select {
padding-right: 5px !important; padding-right: 5px !important;
padding-left: 20px; padding-left: 20px;
} }
} }
&__list{ &__list {
width : 100%; width: 100%;
padding: 10px 0px; padding: 10px 0px;
} }
} }

@ -1,4 +1,5 @@
import React, { Component } from "react"; import React, { Component } from "react";
import { Link } from "react-router-dom";
import Navbar from "../Home/Navbar/index"; import Navbar from "../Home/Navbar/index";
import Footer from "../Home/Footer/index"; import Footer from "../Home/Footer/index";
import VoiceBox from "./VoiceBox/index.js"; import VoiceBox from "./VoiceBox/index.js";
@ -9,6 +10,7 @@ import Links from "./Links/index";
import SubjectsDropdown from "./SubjectsDropdown/index"; import SubjectsDropdown from "./SubjectsDropdown/index";
import BookContent from "./BookContent/index"; import BookContent from "./BookContent/index";
import NightsStayOutlinedIcon from "@material-ui/icons/NightsStayOutlined"; import NightsStayOutlinedIcon from "@material-ui/icons/NightsStayOutlined";
import MoreVertIcon from "@material-ui/icons/MoreVert";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { qr } from "~/Redux/actions"; import { qr } from "~/Redux/actions";
@ -24,6 +26,7 @@ class QR extends Component {
state = { state = {
theme: true, theme: true,
zoom: [10, 10], zoom: [10, 10],
menu: true,
}; };
handleZoom = (type) => { handleZoom = (type) => {
@ -43,6 +46,10 @@ class QR extends Component {
})); }));
} }
}; };
componentDidMount() {
console.log(typeof this.props.qrList);
}
render() { render() {
const { QR, qrList } = this.props; const { QR, qrList } = this.props;
const fontSize = { const fontSize = {
@ -145,51 +152,40 @@ class QR extends Component {
<> <>
<div className="mobile-qr d-flex flex-column"> <div className="mobile-qr d-flex flex-column">
<Navbar /> <Navbar />
{qrList.length === 0 && qrList !== null ? ( <div className="d-flex p-3">
<div className="d-flex flex-column"> {this.state.menu ? (
<div className="d-flex justify-content-end">بازگشت</div>
<h1>فایلی در این صفحه موجود نیست.</h1>
</div>
) : null}
{qrList !== null ? (
<div className="d-flex pt-3">
<div className="mobile-qr__buttons d-flex flex-column align-items-center"> <div className="mobile-qr__buttons d-flex flex-column align-items-center">
<img src={exit} alt="خروج" /> <div>
<img
src={exit}
alt="خروج"
onClick={() =>
this.setState({ menu: !this.state.menu })
}
/>
</div>
<button>نمایش تمامی محتواها</button> <button>نمایش تمامی محتواها</button>
<a
href="#voice"
className="mobile-qr__buttons--voice mobile-qr__buttons--media"
></a>
<a
href="#video"
className="mobile-qr__buttons--video mobile-qr__buttons--media"
></a>
<a
href="#ppt"
className="mobile-qr__buttons--ppt mobile-qr__buttons--media"
></a>
<a
href="#pdf"
className="mobile-qr__buttons--pdf mobile-qr__buttons--media"
></a>
<a
href="#links"
className="mobile-qr__buttons--attachment mobile-qr__buttons--media"
></a>
</div>
<div className="mobile-qr__content d-flex flex-column">
{qrList.map((item, i) => ( {qrList.map((item, i) => (
<Identifier data={item} key={i} /> <MenuIdentifier data={item} key={i} />
))} ))}
</div> </div>
) : (
<div className="mobile-qr__buttons d-flex flex-column align-items-center">
<MoreVertIcon
style={{ fontSize: 40, color: "grey" }}
onClick={() => this.setState({ menu: !this.state.menu })}
/>
</div>
)}
<div className="mobile-qr__content d-flex flex-column">
<div className="mobile-qr-scan__back d-flex mb-2">
<Link to="/">بازگشت</Link>
</div>
{qrList.map((item, i) => (
<Identifier data={item} key={i} />
))}
</div> </div>
) : null} </div>
{qrList === null ? (
<div className="d-flex flex-column align-items-center">
<div className="d-flex justify-content-end">بازگشت</div>
<h1 className="align-center">404</h1>
</div>
) : null}
</div> </div>
</> </>
) : null} ) : null}
@ -254,3 +250,40 @@ const Identifier = (props) => {
</> </>
); );
}; };
const MenuIdentifier = (props) => {
return (
<>
{props.data.type === "voice" ? (
<a
href="#voice"
className="mobile-qr__buttons--voice mobile-qr__buttons--media"
></a>
) : null}
{props.data.type === "video" ? (
<a
href="#video"
className="mobile-qr__buttons--video mobile-qr__buttons--media"
></a>
) : null}
{props.data.type === "pdf" ? (
<a
href="#pdf"
className="mobile-qr__buttons--pdf mobile-qr__buttons--media"
></a>
) : null}
{props.data.type === "ppt" ? (
<a
href="#ppt"
className="mobile-qr__buttons--ppt mobile-qr__buttons--media"
></a>
) : null}
{props.data.type === "links" ? (
<a
href="#links"
className="mobile-qr__buttons--attachment mobile-qr__buttons--media"
></a>
) : null}
</>
);
};

@ -51,15 +51,19 @@
padding-top: 10px 0px; padding-top: 10px 0px;
text-align: center; text-align: center;
overflow-x: hidden; overflow-x: hidden;
height: 100vh; height: calc(100vh - 88px);
position: fixed; position: fixed;
top: 100px; top: 85px;
right: 0px; right: 5px;
overflow-y: scroll;
&::-webkit-scrollbar {
display: none;
width: 0px;
}
&--media { &--media {
width: 100%; width: 100%;
height: 50px; height: 50px;
border-top-left-radius: 8px; border-radius: 8px;
border-bottom-left-radius: 8px;
transform: translateY(120px); transform: translateY(120px);
margin-top: 10px; margin-top: 10px;
} }
@ -99,11 +103,15 @@
width: 140px; width: 140px;
transform: rotate(-90deg) translateX(-65px); transform: rotate(-90deg) translateX(-65px);
} }
& img {
width: 20px;
height: 20px;
}
} }
&__content { &__content {
margin-right: 40px; margin-right: 40px;
width: calc(100% - 40px); width: calc(100% - 40px);
padding: 0px 10px; padding-right: 10px;
h1 { h1 {
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 22); font-size: calc(100vw / 22);

@ -30,7 +30,7 @@ export default class Scanner extends Component {
delay={300} delay={300}
onError={this.handleError} onError={this.handleError}
onScan={this.handleScan} onScan={this.handleScan}
style={{ width: "100%" }} style={{ width: "100%", maxWidth: 300 }}
facingMode={facingMode[this.props.parent.state.facingMode]} facingMode={facingMode[this.props.parent.state.facingMode]}
/> />
) : null} ) : null}
@ -39,7 +39,7 @@ export default class Scanner extends Component {
delay={300} delay={300}
onError={this.handleError} onError={this.handleError}
onScan={this.handleScan} onScan={this.handleScan}
style={{ width: "100%", maxWidth: 300 }} style={{ width: "100%" }}
facingMode={this.props.parent.state.facingMode} facingMode={this.props.parent.state.facingMode}
/> />
) : null} ) : null}

@ -4,7 +4,7 @@
margin: 0px auto; margin: 0px auto;
padding: 0px 10px 40px; padding: 0px 10px 40px;
direction: rtl; direction: rtl;
padding-top: 90px; padding-top: 70px;
overflow-x: hidden; overflow-x: hidden;
&__back { &__back {
justify-content: flex-end; justify-content: flex-end;
@ -23,7 +23,6 @@
} }
} }
&__header { &__header {
margin-top: 30px;
width: 100%; width: 100%;
h1 { h1 {
font-family: numeralBold; font-family: numeralBold;

Loading…
Cancel
Save