reza added some fix

master
Reza_ashrafi 3 years ago
parent b94acb6143
commit eb18a88fbf
  1. 6
      package.json
  2. 1
      src/Redux/proxy.js
  3. BIN
      src/assets/icons/marker-blue.png
  4. BIN
      src/assets/images/about-lg.png
  5. BIN
      src/assets/images/about-md.png
  6. BIN
      src/assets/images/about-xs1.png
  7. BIN
      src/assets/images/about-xs2.png
  8. BIN
      src/assets/images/mapImage.png
  9. 37
      src/views/About/index.js
  10. 57
      src/views/About/index.scss
  11. 4
      src/views/Auth/Login/Cellphone/index.js
  12. 2
      src/views/Auth/Login/Code/index.js
  13. 111
      src/views/Auth/Login/Code/index.scss
  14. 61
      src/views/ChatList/Chat/index.js
  15. 3
      src/views/ChatList/Chat/index.scss
  16. 7
      src/views/ChatList/index.js
  17. 28
      src/views/ChatList/index.scss
  18. 2
      src/views/ChatRoom/Header/index.scss
  19. 1
      src/views/ChatRoom/index.scss
  20. 5
      src/views/Contact/index.js
  21. 2
      src/views/Contact/index.scss
  22. 4
      src/views/Faq/Collapse/index.js
  23. 9
      src/views/Faq/index.js
  24. 1
      src/views/Faq/index.scss
  25. 15
      src/views/Product/AddToCart/index.js
  26. 5
      src/views/Product/AddToCart/index.scss
  27. 4
      src/views/Product/BreadCrumb/index.js
  28. 11
      src/views/Product/BreadCrumb/index.scss
  29. 22
      src/views/Product/Gallery/index.js
  30. 21
      src/views/Product/Gallery/index.scss
  31. 15
      src/views/Product/Info/index.js
  32. 5
      src/views/Product/Info/index.scss
  33. 106
      src/views/Product/index.js
  34. 2
      src/views/Product/index.scss
  35. 2
      src/views/QRScan/index.js
  36. 58
      src/views/QRScan/index.scss
  37. 54
      yarn.lock

@ -11,7 +11,12 @@
"array-move": "^3.0.1",
"audio-react-recorder": "^1.0.4",
"axios": "^0.21.1",
"babel-eslint": "^10.1.0",
"babel-plugin-import-directory": "^1.1.0",
"babel-plugin-wildcard": "^7.0.0",
"bootstrap": "^5.0.1",
"create-index": "^2.6.0",
"history": "^5.0.0",
"jalali-moment": "^3.3.10",
"prettier": "^2.3.1",
"prop-types": "^15.7.2",
@ -19,7 +24,6 @@
"react-audio-player": "^0.17.0",
"react-dom": "^17.0.2",
"react-elastic-carousel": "^0.11.5",
"react-leaflet": "^3.2.0",
"react-player": "^2.9.0",
"react-qr-scanner": "^1.0.0-alpha.7",
"react-redux": "^7.2.4",

@ -48,6 +48,7 @@ class Proxy {
localStorage.setItem('refresh', login.refreshToken);
delete login.refreshToken;
localStorage.setItem('userData', JSON.stringify(login));
window.location = "/";
if (data != {}) window.router.setState({ islogin: true });
return this.result('login', login);
};

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 659 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 207 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 101 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 366 KiB

@ -3,8 +3,26 @@ import Navbar from "../Home/Navbar/index";
import Footer from "../Home/Footer/index";
import pic from "../../assets/images/pic.png";
import aboutLg from "../../assets/images/about-lg.png";
import aboutMd from "../../assets/images/about-md.png";
import aboutXs1 from "../../assets/images/about-xs1.png";
import aboutXs2 from "../../assets/images/about-xs2.png";
import "./index.scss";
const maxDesktopSize = 1250;
const maxMobileSize = 650;
const fontSize = {
desktop:{
h1: window.innerWidth > maxDesktopSize ? 30 : window.innerWidth / 40,
p: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 80,
h2: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 70,
li : window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 80,
}
};
export default class About extends Component {
state = {
fury: {
@ -42,33 +60,38 @@ export default class About extends Component {
<div className="about__fury d-flex">
<div className="about__fury--right d-flex flex-column justify-content-center">
<div className="right-top align-self-start">
<h1>{fury.title}</h1>
<p>{fury.text}</p>
<h1 style={{ fontSize: fontSize.desktop.h1 }}>{fury.title}</h1>
<p style={{ fontSize: fontSize.desktop.p }}>{fury.text}</p>
</div>
<div className="right-bottom align-self-end">
<h1>{keywords.title}</h1>
<h2 style={{ fontSize: fontSize.desktop.h2 }}>{keywords.title}</h2>
<ul>
{keywords.list.map((item, i) => (
<Fragment key={i}>
<li>{item}</li><br/>
<li style={{ fontSize: fontSize.desktop.li }}>{item}</li><br/>
</Fragment>
))}
</ul>
</div>
</div>
<div className="about__fury--left d-flex align-items-center"></div>
<div className="about__fury--left d-flex align-items-center">
<img className="about__fury--left__1" src={aboutLg} alt="عکس" />
<img className="about__fury--left__2" src={aboutMd} alt="عکس" />
<img className="about__fury--left__3" src={aboutXs1} alt="عکس" />
<img className="about__fury--left__4" src={aboutXs2} alt="عکس" />
</div>
</div>
<div className="about__advantages d-flex">
<div className="about__advantages--right d-flex">
<img src={pic} alt={'عکس'} />
</div>
<div className="about__advantages--left">
<h1>{advantages.title}</h1>
<h1 style={{ fontSize: fontSize.desktop.h1 }}>{advantages.title}</h1>
<ul>
{advantages.list.map((item, i) => (
<Fragment key={i}>
<li>{item}</li><br/>
<li style={{ fontSize: fontSize.desktop.li }}>{item}</li><br/>
</Fragment>
))}

@ -8,7 +8,7 @@
&__fury {
margin-top: 30px;
width: 100%;
height: 400px;
height: 650px;
justify-content: space-between;
&--right {
align-items: center;
@ -18,25 +18,23 @@
display: inline;
letter-spacing: -2px;
font-family: numeralBold;
font-size: calc(100vw / 55);
background-color: #7dc241;
background-color: #00CC69;
color: white;
}
p {
margin-top: 10px;
text-align: justify;
font-family: numeralLight;
font-size: calc(100vw / 90);
color: #6d6d6d;
letter-spacing: -1px;
}
}
.right-bottom {
margin-top: 20px;
h1 {
h2 {
display: inline;
font-family: numeralBold;
font-size: calc(100vw / 85);
background-color: #7dc241;
background-color: #00CC69;
color: white;
}
ul {
@ -46,9 +44,8 @@
margin-top: 5px;
li {
display: inline;
border-bottom: 2px solid #7dc241;
border-bottom: 2px solid #00CC69;
font-family: numeralLight;
font-size: calc(100vw / 95);
color: #6d6d6d;
}
}
@ -56,8 +53,42 @@
}
&--left {
width: 60%;
background-color: #eee;
height: 100%;
position: relative;
& img{
position: absolute;
}
&__1{
top:0px;
left: 100px;
z-index: 100;
height: 470px;
width: 470px
}
&__2{
left: 430px;
bottom: 80px;
z-index: 150;
height: 235px;
width: 235px;
}
&__3{
bottom: 0px;
left: 310px;
z-index: 200;
height: 200px;
width: 200px;
}
&__4{
top: 50px;
left: 0px;
z-index: 150;
height: 200px;
width: 200px;
}
}
}
&__advantages {
@ -71,7 +102,7 @@
height: 100%;
}
&--left {
padding-top: 80px;
padding-top: 20px;
width: 48%;
height: 100%;
align-items: flex-end;
@ -79,8 +110,7 @@
h1 {
display: inline;
font-family: numeralBold;
font-size: calc(100vw / 55);
background-color: #7dc241;
background-color: #00CC69;
color: white;
}
ul {
@ -92,7 +122,6 @@
display: inline;
text-align: justify;
font-family: numeralLight;
font-size: calc(100vw / 90);
color: #6d6d6d;
}
}

@ -38,7 +38,7 @@ export default class Cellphone extends Component {
})
}
>
<span style={{ fontSize: fontSize.desktop.span }}>+98</span>
<span style={{ fontSize: fontSize.desktop.span }}>09</span>
<img src={iran} alt="پرچم" />
<input
style={{ fontSize: fontSize.desktop.span }}
@ -104,7 +104,7 @@ export default class Cellphone extends Component {
})
}
>
<span>+98</span>
<span>09</span>
<img src={iran} alt="پرچم" />
<input
id="cellphone"

@ -147,7 +147,6 @@ export default class Code extends Component {
</label>
<label htmlFor="code4">
<input
id="code4"
name="o4"
type="text"
@ -248,6 +247,7 @@ export default class Code extends Component {
onKeyDown={(e) => this.keyboardEvent(e)}
onInput={this.onInput}
onChange={(e) => this.changeValue(e)}
// style={{ fontSize: fontSize.desktop.input }}
/>
</label>
<label htmlFor="code3">

@ -44,67 +44,66 @@
}
}
}
}
.mobile-auth-code{
.mobile-auth-code{
width: 100%;
height: 100%;
justify-content:center;
align-items:center;
direction: ltr;
position: relative;
max-width: 360px;
margin: 0px auto;
img {
margin-bottom: 30px;
position: relative;
bottom: 40px;
}
h1 {
font-family: numeralBold;
font-size: calc(100vw / 15);
color: #6f7074;
position: relative;
bottom: 40px;
}
p {
font-family: numeralLight;
font-size: calc(100vw / 25);
color: #6f7074;
letter-spacing: -1px;
position: relative;
bottom: 40px;
}
button{
margin-top: 20px;
width: 100%;
height: 100%;
justify-content:center;
align-items:center;
max-width: 300px;
border: 0px;
font-family: numeralMedium;
background-color: #6CBE44;
color: white;
border-radius: 7px;
padding: 8px;
font-size: calc(100vw / 20);
}
&__codes{
direction: ltr;
position: relative;
max-width: 360px;
margin: 0px auto;
img {
margin-bottom: 30px;
position: relative;
bottom: 40px;
}
h1 {
font-family: numeralBold;
input {
max-width: 60px;
max-height: 60px;
background-color: #f2f2f2;
border : 0px;
margin : 0px 10px;
color: #6F7074;
text-align: center;
direction : ltr;
font-size: calc(100vw / 15);
color: #6f7074;
position: relative;
bottom: 40px;
}
p {
font-family: numeralLight;
font-size: calc(100vw / 25);
color: #6f7074;
letter-spacing: -1px;
position: relative;
bottom: 40px;
}
button{
margin-top: 20px;
width: 100%;
max-width: 300px;
border: 0px;
font-family: numeralMedium;
background-color: #6CBE44;
color: white;
border-radius: 7px;
padding: 8px;
font-size: calc(100vw / 20);
}
&__codes{
direction: ltr;
input {
max-width: 60px;
max-height: 60px;
background-color: #f2f2f2;
border : 0px;
margin : 0px 10px;
color: #6F7074;
text-align: center;
direction : ltr;
font-size: calc(100vw / 15);
border-radius: 5px;
padding: 10px 15px;
&:focus{
outline: 0px;
}
border-radius: 5px;
padding: 10px 15px;
&:focus{
outline: 0px;
}
}
}
}

@ -1,40 +1,57 @@
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import moment from 'jalali-moment';
import Avatar from '@material-ui/core/Avatar';
import React, { Component } from "react";
import { Link } from "react-router-dom";
import moment from "jalali-moment";
import Avatar from "@material-ui/core/Avatar";
import './index.scss';
import "./index.scss";
export default class Chat extends Component {
render() {
const { data } = this.props;
const { data, selectedUser } = this.props;
return (
<>
{
window.innerWidth < 1000 ?
{window.innerWidth < 1000 ? (
<Link to={`/chatroom/${data.id}`} className="chat d-flex">
<Avatar src={data.imageUrl} alt={data.name} className={'avatar fontLight'} />
<Avatar
src={data.imageUrl}
alt={data.name}
className={"avatar fontLight"}
/>
<div className="chat__data d-flex flex-column">
<h1 className="chat__data--name">{data.name}</h1>
<p className="chat__data--lastMessage">{data.lastMessage.slice(0, 40) + '...'}</p>
<p className="chat__data--lastMessage">
{data.lastMessage.slice(0, 40) + "..."}
</p>
<span>{data.badge}</span>
<div>{moment(data.date || new Date()).format('jD/jM hh:mm')}</div>
<div>{moment(data.date || new Date()).format("jD/jM hh:mm")}</div>
</div>
</Link> : null
}
{
window.innerWidth > 1000 ?
<div className="chat d-flex" onClick={() => this.props.parent.setState({ selectedUser : data.id })}>
<Avatar src={data.imageUrl} alt={data.name} className={'avatar fontLight'} />
</Link>
) : null}
{window.innerWidth > 1000 ? (
<div
className="chat d-flex"
onClick={() =>
this.props.parent.setState({ selectedUser: data.id })
}
style={{
backgroundColor: selectedUser === data.id ? "#eee" : "white",
}}
>
<Avatar
src={data.imageUrl}
alt={data.name}
className={"avatar fontLight"}
/>
<div className="chat__data d-flex flex-column">
<h1 className="chat__data--name">{data.name}</h1>
<p className="chat__data--lastMessage">{data.lastMessage.slice(0, 40) + '...'}</p>
<p className="chat__data--lastMessage">
{data.lastMessage.slice(0, 40) + "..."}
</p>
<span>{data.badge}</span>
<div>{moment(data.date || new Date()).format('jD/jM hh:mm')}</div>
<div>{moment(data.date || new Date()).format("jD/jM hh:mm")}</div>
</div>
</div> : null
}
</div>
) : null}
</>
);
}
}

@ -3,11 +3,11 @@
width: 100%;
direction: rtl;
align-items: center;
margin-bottom: 10px;
position: relative;
padding: 0px 0px 0px;
text-decoration: none;
cursor: pointer;
background-color:white;
.avatar {
background-color: #b4b4b4;
width: 55px;
@ -22,7 +22,6 @@
justify-content: space-around;
height: 100%;
padding: 10px 10px 20px;
border-bottom: rgba(209, 208, 208, 0.7) solid 1px;
&--name {
font-size: 18px;

@ -44,7 +44,7 @@ class ChatList extends Component {
<div className="desktop-chat__list d-flex flex-column">
<Search />
{this.props.chat_list.map((item, i) => (
<Chat key={i} data={item} parent={this} />
<Chat selectedUser={this.state.selectedUser} key={i} data={item} parent={this} />
))}
<Link to="/characters" className="desktop-chat__list--float d-flex">
<ChatIcon fontSize="small" />
@ -52,7 +52,10 @@ class ChatList extends Component {
</div>
{
this.state.selectedUser ?
<Chatroom id={this.state.selectedUser} /> : null
<Chatroom id={this.state.selectedUser} /> :
<div className="desktop-chat__before d-flex">
<h1>برای شروع روی یک چت کلیک کن</h1>
</div>
}
</div> : null

@ -25,14 +25,14 @@
}
}
.desktop-chat{
.desktop-chat {
width: 100vw;
height: 90vh;
max-width: 1250px;
margin:5vh auto;
margin: 5vh auto;
box-shadow: 0px 0px 10px rgb(209, 209, 209);
overflow: hidden;
&__banner{
&__banner {
position: fixed;
left: 0px;
top: 0px;
@ -40,7 +40,23 @@
height: 150px;
background-color: #7dc241;
}
&__list{
&__before {
flex: 1;
height: 100%;
overflow: hidden;
width: 100vw;
position: relative;
overflow-x: hidden;
background-color: white;
justify-content: center;
align-items: center;
h1{
font-family: numeralBold;
font-size: 20px;
color: #afafaf;
}
}
&__list {
width: cacl(100% / 3);
min-width: 350px;
height: 100%;
@ -50,8 +66,8 @@
position: relative;
padding: 10px;
z-index: 10;
background-color:white;
&::-webkit-scrollbar{
background-color: white;
&::-webkit-scrollbar {
display: none;
}
&--float {

@ -15,7 +15,7 @@
color: black;
margin: 0px;
margin-bottom: 5px;
font-weight: 600;
font-family: numeralMedium;
}
& span {
color: #464646;

@ -9,7 +9,6 @@
border-top-left-radius: 40px;
border-top-right-radius: 40px;
height: 150px;
background: rgb(106, 103, 250);
position: relative;
align-items: center;
justify-content: flex-start;

@ -6,6 +6,7 @@ import Select from "./Select/index";
import location from "../../assets/icons/location.png";
import home from "../../assets/icons/home.png";
import contact from "../../assets/icons/contact.png";
// import Location from "./Location/Location";
import "./index.scss";
export default class Contact extends Component {
@ -13,7 +14,7 @@ export default class Contact extends Component {
return (
<>
<div className="contact d-flex flex-column align-items-center">
<Navbar page={'contact'} />
<Navbar page={"contact"} />
<div className="contact__forms d-flex">
<div className="contact__forms--right d-flex flex-column">
<h1>تماس با ما</h1>
@ -51,7 +52,7 @@ export default class Contact extends Component {
</div>
</div>
<div className="contact__map d-flex align-items-center">
{/* <Location /> */}
</div>
</div>
</div>

@ -150,6 +150,8 @@
width: 100%;
height: 430px;
background-color: #eee;
border-radius: 20px;
background: url(../../assets/images/mapImage.png);
}
}
}

@ -13,8 +13,8 @@ const fontSize = {
div: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 30,
},
desktop: {
h2: window.innerWidth > maxMobileSize ? 22 : window.innerWidth / 80,
div: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 95,
h2: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 85,
div: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 95,
},
};
export default class Collapse extends Component {

@ -16,6 +16,13 @@ const fontSize = {
span: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 75,
form: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 70,
},
desktop: {
h1: window.innerWidth > maxDesktopSize ? 30 : window.innerWidth / 40,
button: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 85,
p: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 85,
span: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 75,
form: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 70,
},
};
export default class Faq extends Component {
state = {
@ -83,7 +90,7 @@ export default class Faq extends Component {
<div className="faq d-flex flex-column align-items-center">
<Navbar page={"faq"} />
<header className="faq__header d-flex flex-column align-items-center">
<h1>سلام چطوری میتونم کمکتون کنم؟</h1>
<h1 style={{fontSize: fontSize.desktop.h1 }}>سلام چطوری میتونم کمکتون کنم؟</h1>
<div className="faq__header--search d-flex align-items-center">
<input
type="search"

@ -7,6 +7,7 @@
min-height: calc(100vh - 288px);
&__header {
margin-top: 30px;
width: 600px;
h1 {
letter-spacing: -2px;
font-family: numeralBold;

@ -0,0 +1,15 @@
import React, { Component } from 'react';
import './index.scss';
export default function AddToCart(props) {
return(
<>
{
window.innerWidth > 1000 ?
<section className="product-addtocart d-flex flex-column">
</section> : null
}
</>
);
}

@ -0,0 +1,5 @@
.product-addtocart{
flex: 3.5;
background-color: #eee;
margin: 10px;
}

@ -13,7 +13,7 @@ const maxDesktopSize = 1250;
const maxMobileSize = 650;
const fontSize = {
desktop: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 85,
desktop: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 90,
mobile : window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 25,
};
@ -27,7 +27,7 @@ export default function ActiveLastBreadcrumb() {
پایه هفتم
</Link>
<Link
style={{ fontSize: window.innerWidth > maxDesktopSize ? fontSize.desktop : fontSize.mobile}}
style={{ fontSize: window.innerWidth > maxDesktopSize ? fontSize.desktop : fontSize.mobile, color: '#00CC69'}}
to="/products/1"
onClick={handleClick}
>

@ -1,5 +1,8 @@
a {
text-decoration: none;
font-family: numeralLight;
color: #6F7074;
.MuiBreadcrumbs-li{
a {
text-decoration: none;
font-family: numeralLight;
color: #6F7074;
letter-spacing: -1px;
}
}

@ -0,0 +1,22 @@
import React, { Component } from 'react';
import './index.scss';
export default function Gallery(props) {
return(
<>
{
window.innerWidth > 1000 ?
<section className="product-gallery d-flex flex-column">
<div className="product-gallery__top">
</div>
<div className="product-gallery__list d-flex">
<div></div>
<div></div>
<div></div>
</div>
</section> : null
}
</>
);
}

@ -0,0 +1,21 @@
.product-gallery{
flex: 5;
margin: 10px;
justify-content: space-between;
&__top{
width: 100%;
height: 320px;
background-color: #eee;
border-radius: 20px;
}
&__list{
width: 100%;
justify-content: space-between;
& div{
min-width: 110px;
height: 110px;
background-color: #eee;
border-radius: 20px;
}
}
}

@ -0,0 +1,15 @@
import React, { Component } from 'react';
import './index.scss';
export default function Info(props) {
return(
<>
{
window.innerWidth > 1000 ?
<section className="product-info d-flex flex-column">
</section> : null
}
</>
);
}

@ -0,0 +1,5 @@
.product-info{
flex: 6;
background-color: #eee;
margin: 10px;
}

@ -1,17 +1,20 @@
import React, { Component } from "react";
import {Link} from 'react-router-dom';
import { Link } from "react-router-dom";
import Footer from "../Home/Footer/index";
import Navbar from "../Home/Navbar/index";
import Comment from './Comment/index';
import Breadcrumbs from './BreadCrumb/index';
import Comment from "./Comment/index";
import Breadcrumbs from "./BreadCrumb/index";
import Gallery from "./Gallery/index";
import Info from "./Info/index";
import AddToCart from "./AddToCart/index";
import book2 from "../../assets/images/book2.png";
import './index.scss';
import "./index.scss";
export default class Product extends Component {
render() {
const {product} = this.props;
const { product } = this.props;
return (
<>
{window.innerWidth > 1000 ? (
@ -20,7 +23,9 @@ export default class Product extends Component {
<Navbar />
<Breadcrumbs />
<header class="product__header d-flex mt-4">
<Gallery />
<Info />
<AddToCart />
</header>
</div>
<Footer />
@ -35,8 +40,18 @@ export default class Product extends Component {
<h1>{product.title}</h1>
<h2>{product.subTitle}</h2>
<div className="d-flex mt-3">
<Link to={`/products/${product.id}/sample`} className="mobile-product__header--sampleButton">مطالعه نمومه کتاب</Link>
<Link to={`/products/${product.id}/sample`} className="mobile-product__header--purchase">خرید کتاب</Link>
<Link
to={`/products/${product.id}/sample`}
className="mobile-product__header--sampleButton"
>
مطالعه نمومه کتاب
</Link>
<Link
to={`/products/${product.id}/sample`}
className="mobile-product__header--purchase"
>
خرید کتاب
</Link>
</div>
</header>
<div className="mobile-product__abstraction d-flex flex-column">
@ -69,11 +84,9 @@ export default class Product extends Component {
<div className="mobile-product__comments d-flex flex-column">
<h1>نظرات خریداران</h1>
<div className="mobile-product__comments--list d-flex">
{
product.comments.map((item,i) => (
<Comment comment={item} key={i} />
))
}
{product.comments.map((item, i) => (
<Comment comment={item} key={i} />
))}
</div>
</div>
</div>
@ -93,31 +106,60 @@ Product.defaultProps = {
price: "39.000",
oldPrice: "59.000",
date: new Date(),
abstraction: 'لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشت',
abstraction:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشت",
modules: [
'پک هدیه شامل یک عدد جلد سخت',
'عینک واقعیت مجازی',
'کارت گرافیک مناسب جهت اجرای بازی',
"پک هدیه شامل یک عدد جلد سخت",
"عینک واقعیت مجازی",
"کارت گرافیک مناسب جهت اجرای بازی",
],
tips: [
'پک هدیه شامل یک عدد جلد سخت',
'عینک واقعیت مجازی',
'کارت گرافیک مناسب جهت اجرای بازی',
"پک هدیه شامل یک عدد جلد سخت",
"عینک واقعیت مجازی",
"کارت گرافیک مناسب جهت اجرای بازی",
],
description: 'لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشت',
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشت",
comments: [
{id: 0, username: 'محمدرضا', date: new Date(), text: 'عالی بود. ممنون از سایت زیباتون', score: 4},
{id: 1, username: 'محمدرضا', date: new Date(), text: 'عالی بود. ممنون از سایت زیباتون', score: 2.5},
{id: 2, username: 'محمدرضا', date: new Date(), text: 'عالی بود. ممنون از سایت زیباتون', score: 5},
{id: 3, username: 'محمدرضا', date: new Date(), text: 'عالی بود. ممنون از سایت زیباتون', score: 3.7},
{id: 4, username: 'محمدرضا', date: new Date(), text: 'عالی بود. ممنون از سایت زیباتون', score: 2},
]
{
id: 0,
username: "محمدرضا",
date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون",
score: 4,
},
{
id: 1,
username: "محمدرضا",
date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون",
score: 2.5,
},
{
id: 2,
username: "محمدرضا",
date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون",
score: 5,
},
{
id: 3,
username: "محمدرضا",
date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون",
score: 3.7,
},
{
id: 4,
username: "محمدرضا",
date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون",
score: 2,
},
],
},
};
const Item = (props) => {
return(
<li>+ {props.item}</li>
);
}
return <li>+ {props.item}</li>;
};

@ -153,7 +153,9 @@
overflow-x: hidden;
min-height: calc(100vh - 288px);
&__header{
margin-top: 30px;
width: 100%;
height: 470px;
padding: 0px 10px;
}
}

@ -19,7 +19,7 @@ export default class QRScan extends Component {
<>
{window.innerWidth > 1000 ? (
<>
<div className="product-sample d-flex">
<div className="qr-scan d-flex flex-column">
<Navbar />
</div>
<Footer />

@ -1,66 +1,66 @@
.mobile-qr-scan{
.mobile-qr-scan {
width: 100vw;
max-width: 1250px;
margin: 0px auto;
padding : 0px 10px 40px;
padding: 0px 10px 40px;
direction: rtl;
padding-top: 70px;
overflow-x: hidden;
&__back{
justify-content:flex-end;
a{
&__back {
justify-content: flex-end;
a {
display: inline;
font-family: numeralLight;
text-decoration: none;
padding: 5px 20px 3px;
background-color: #00CC69;
background-color: #00cc69;
border-radius: 25px;
font-size: calc(100vw / 26);
color: white;
&:focus:enabled{
&:focus:enabled {
text-decoration: none;
}
}
}
&__header{
&__header {
margin-top: 30px;
width: 100%;
h1{
h1 {
font-family: numeralBold;
color: #4CE1BE;
color: #4ce1be;
font-size: calc(100vw / 13);
}
p{
p {
text-align: justify;
font-family: numeralMedium;
color: #4CE1BE;
color: #4ce1be;
font-size: calc(100vw / 28);
}
}
&__camera{
&__camera {
margin-top: 20px;
width: 320px;
height: 245px;
border-radius: 10px;
margin: 30px auto;
position: relative;
&--shape{
&--shape {
position: absolute;
background-color: rgba(0, 0, 0, 0.8);
}
&--shapeTop{
&--shapeTop {
width: calc(100% - 60px);
height: 30px;
left: 30px;
top: 0px;
}
&--shapeBottom{
&--shapeBottom {
width: calc(100% - 60px);
height: 30px;
left: 30px;
bottom: 0px;
}
&--shapeLeft{
&--shapeLeft {
width: 30px;
height: 100%;
left: 0px;
@ -68,7 +68,7 @@
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
&--shapeRight{
&--shapeRight {
width: 30px;
height: 100%;
right: 0px;
@ -76,7 +76,7 @@
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
&--shapeCenter{
&--shapeCenter {
position: absolute;
width: calc(100% - 60px);
height: calc(100% - 60px);
@ -85,20 +85,30 @@
border: 3px solid red;
}
}
&__text{
&__text {
text-align: justify;
font-family: numeralMedium;
color: #4CE1BE;
color: #4ce1be;
font-size: calc(100vw / 28);
}
&__lasts{
&__lasts {
width: 100%;
margin: 30px 0px;
h2{
h2 {
font-family: numeralBold;
color: #02A255;
color: #02a255;
font-size: calc(100vw / 24);
margin-bottom: 20px;
}
}
}
.qr-scan {
width: 100vw;
max-width: 1250px;
min-height: calc(100vh - 288px);
margin: 0px auto;
padding: 0px 10px;
direction: rtl;
overflow-x: hidden;
}

@ -1171,14 +1171,14 @@
dependencies:
regenerator-runtime "^0.13.4"
"@babel/runtime@^7.2.0":
"@babel/runtime@^7.2.0", "@babel/runtime@^7.7.6":
version "7.14.6"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.6.tgz#535203bc0892efc7dec60bdc27b2ecf6e409062d"
integrity sha512-/PCB2uJ7oM44tz8YhC4Z/6PeOKXp4K588f+5M3clr1M4zbqztlo0XEfJ2LEzj/FgwfgGcIdl8n7YYjTCI0BYwg==
dependencies:
regenerator-runtime "^0.13.4"
"@babel/template@^7.10.4", "@babel/template@^7.14.5", "@babel/template@^7.3.3":
"@babel/template@^7.1.2", "@babel/template@^7.10.4", "@babel/template@^7.14.5", "@babel/template@^7.3.3":
version "7.14.5"
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.14.5.tgz#a9bc9d8b33354ff6e55a9c60d1109200a68974f4"
integrity sha512-6Z3Po85sfxRGachLULUhOmvAaOo7xCvqGQtxINai2mEGPFm6pQ4z5QInFnUrRpfoSV60BnjyF5F3c+15fxFV1g==
@ -1606,11 +1606,6 @@
schema-utils "^2.6.5"
source-map "^0.7.3"
"@react-leaflet/core@^1.1.0":
version "1.1.0"
resolved "https://registry.yarnpkg.com/@react-leaflet/core/-/core-1.1.0.tgz#389b2b373f1da4caeb3c4cf6f33d84561c58d504"
integrity sha512-zFxMHgfjCi7khRVB7o7H8NoJl36NaezvfcaeEurVXx22lAGHFlTHiSuLOGA4tOiHj+Ep+Lo3uwUGJ3YM9BGkHg==
"@rollup/plugin-node-resolve@^7.1.1":
version "7.1.3"
resolved "https://registry.yarnpkg.com/@rollup/plugin-node-resolve/-/plugin-node-resolve-7.1.3.tgz#80de384edfbd7bfc9101164910f86078151a3eca"
@ -2791,6 +2786,13 @@ babel-plugin-dynamic-import-node@^2.3.3:
dependencies:
object.assign "^4.1.0"
babel-plugin-import-directory@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/babel-plugin-import-directory/-/babel-plugin-import-directory-1.1.0.tgz#69c3f630418cae8d97fec35211a6a538f6bb4df6"
integrity sha512-D0zOCA1g+OPYFVDl1R63wcQ3/viQt9dwfQfu+QnsQcpHzbNkiNqnlFQnBWgMgaf/oReb8tKEQ1ssFUK4vOC2Xw==
dependencies:
"@babel/template" "^7.1.2"
babel-plugin-istanbul@^6.0.0:
version "6.0.0"
resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-6.0.0.tgz#e159ccdc9af95e0b570c75b4573b7c34d671d765"
@ -2883,6 +2885,13 @@ babel-plugin-transform-react-remove-prop-types@0.4.24:
resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.24.tgz#f2edaf9b4c6a5fbe5c1d678bfb531078c1555f3a"
integrity sha512-eqj0hVcJUR57/Ug2zE1Yswsw4LhuqqHhD+8v120T1cl3kjg76QwtyBrdIk4WVwK+lAhBJVYCd/v+4nc4y+8JsA==
babel-plugin-wildcard@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/babel-plugin-wildcard/-/babel-plugin-wildcard-7.0.0.tgz#ad72322e6b794717eeb616f8966c17ec1e431bfb"
integrity sha512-3duaRaULzxmmgr+YO9EPEE3m/irVyOWKvXCOz2S41tlp0g2UarSEtpM++D3IS+asK205OOqW1ajnjFeoRRqfZg==
dependencies:
rimraf "^2.6.2"
babel-preset-current-node-syntax@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/babel-preset-current-node-syntax/-/babel-preset-current-node-syntax-1.0.1.tgz#b4399239b89b2a011f9ddbe3e4f401fc40cff73b"
@ -3853,6 +3862,17 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
safe-buffer "^5.0.1"
sha.js "^2.4.8"
create-index@^2.6.0:
version "2.6.0"
resolved "https://registry.yarnpkg.com/create-index/-/create-index-2.6.0.tgz#6839c1445513a23c655d331bcdb34528466d6bf9"
integrity sha512-c9p7sNMIfiKv+RRORw9jbwxMRLrkt0Hq8PFGLxcDXGoMqqGrwnDIw97tUnpdp9rAkIToAPbqejH6qHpGWQGAww==
dependencies:
chalk "^4.0.0"
glob "^7.1.6"
lodash "^4.17.15"
moment "^2.25.3"
yargs "^15.3.1"
cross-spawn@7.0.3, cross-spawn@^7.0.0, cross-spawn@^7.0.2:
version "7.0.3"
resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
@ -5732,6 +5752,13 @@ history@^4.9.0:
tiny-warning "^1.0.0"
value-equal "^1.0.1"
history@^5.0.0:
version "5.0.0"
resolved "https://registry.yarnpkg.com/history/-/history-5.0.0.tgz#0cabbb6c4bbf835addb874f8259f6d25101efd08"
integrity sha512-3NyRMKIiFSJmIPdq7FxkNMJkQ7ZEtVblOQ38VtKaA0zZMW1Eo6Q6W8oDKEflr1kNNTItSnk4JMCO1deeSgbLLg==
dependencies:
"@babel/runtime" "^7.7.6"
hmac-drbg@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
@ -7722,7 +7749,7 @@ mkdirp@^1.0.3, mkdirp@^1.0.4:
resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
moment@^2.26.0:
moment@^2.25.3, moment@^2.26.0:
version "2.29.1"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
@ -9529,13 +9556,6 @@ react-is@^16.13.1, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
react-leaflet@^3.2.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/react-leaflet/-/react-leaflet-3.2.0.tgz#8d5d05beab3f9e52665738ad737bb7b1da99f30b"
integrity sha512-eHVqoRGjW8T9GxLt7jyTKP3BDQ7XQ5AD+tc/zkbaABn1dbmREDy8GojNcYjZQa3QFLQoOLQMcUC1PTtzytZpUA==
dependencies:
"@react-leaflet/core" "^1.1.0"
react-only-when@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/react-only-when/-/react-only-when-1.0.2.tgz#a8a79b48dd6cfbd91ddc710674a94153e88039d3"
@ -10115,7 +10135,7 @@ rgba-regex@^1.0.0:
resolved "https://registry.yarnpkg.com/rgba-regex/-/rgba-regex-1.0.0.tgz#43374e2e2ca0968b0ef1523460b7d730ff22eeb3"
integrity sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=
rimraf@^2.5.4, rimraf@^2.6.3:
rimraf@^2.5.4, rimraf@^2.6.2, rimraf@^2.6.3:
version "2.7.1"
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec"
integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==
@ -12159,7 +12179,7 @@ yargs@^13.3.2:
y18n "^4.0.0"
yargs-parser "^13.1.2"
yargs@^15.4.1:
yargs@^15.3.1, yargs@^15.4.1:
version "15.4.1"
resolved "https://registry.yarnpkg.com/yargs/-/yargs-15.4.1.tgz#0d87a16de01aee9d8bec2bfbf74f67851730f4f8"
integrity sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==

Loading…
Cancel
Save