reza changes improts

master
RezaAshrafi77 3 years ago
parent f414876aae
commit 48d4374986
  1. 3
      .babelrc
  2. 4
      .vscode/settings.json
  3. 3
      package.json
  4. 2
      src/App.js
  5. 0
      src/assets/images/book-cover-mockup.png
  6. 0
      src/assets/images/book-mockup.png
  7. 0
      src/assets/images/chemistry-10.png
  8. 0
      src/assets/images/graphic-ghost.png
  9. 0
      src/assets/images/sciense-6.png
  10. 0
      src/assets/images/sciense-7.png
  11. 0
      src/assets/images/sciense-8.png
  12. 0
      src/assets/images/sciense-9.png
  13. 0
      src/assets/images/zist-10.png
  14. 31
      src/constants/images.js
  15. 19
      src/views/Activation/index.js
  16. 13
      src/views/Cart/index.js
  17. 627
      src/views/Home/index.js
  18. 32
      src/views/MyBooks/index.js
  19. 63
      src/views/Product/index.js
  20. 64
      src/views/Product/index.scss
  21. 76
      src/views/Products/index.js
  22. 43
      src/views/QR/index.js
  23. 9
      src/views/QRScan/index.js
  24. 7
      yarn.lock

@ -0,0 +1,3 @@
{
"plugins": [["babel-plugin-root-import"]]
}

@ -0,0 +1,4 @@
{
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
}

@ -66,5 +66,8 @@
"last 1 firefox version", "last 1 firefox version",
"last 1 safari version" "last 1 safari version"
] ]
},
"devDependencies": {
"babel-plugin-root-import": "^6.6.0"
} }
} }

@ -2,7 +2,7 @@ import React, { Component } from "react";
import AppRouter from "./AppRouter"; import AppRouter from "./AppRouter";
import store from "./Redux/store"; import store from "./Redux/store";
import { Provider } from "react-redux"; import { Provider } from "react-redux";
import 'bootstrap/dist/css/bootstrap.min.css'; import "bootstrap/dist/css/bootstrap.min.css";
class App extends Component { class App extends Component {
render() { render() {

Before

Width:  |  Height:  |  Size: 87 KiB

After

Width:  |  Height:  |  Size: 87 KiB

Before

Width:  |  Height:  |  Size: 39 KiB

After

Width:  |  Height:  |  Size: 39 KiB

Before

Width:  |  Height:  |  Size: 221 KiB

After

Width:  |  Height:  |  Size: 221 KiB

Before

Width:  |  Height:  |  Size: 88 KiB

After

Width:  |  Height:  |  Size: 88 KiB

Before

Width:  |  Height:  |  Size: 287 KiB

After

Width:  |  Height:  |  Size: 287 KiB

Before

Width:  |  Height:  |  Size: 102 KiB

After

Width:  |  Height:  |  Size: 102 KiB

Before

Width:  |  Height:  |  Size: 227 KiB

After

Width:  |  Height:  |  Size: 227 KiB

Before

Width:  |  Height:  |  Size: 186 KiB

After

Width:  |  Height:  |  Size: 186 KiB

Before

Width:  |  Height:  |  Size: 256 KiB

After

Width:  |  Height:  |  Size: 256 KiB

@ -0,0 +1,31 @@
import about_lg from `${imagesRoot}/about-lg.png`;
import about_md from `${imagesRoot}/about-md.png`;
import about_xs1 from `${imagesRoot}/about-xs1.png`;
import about_xs2 from `${imagesRoot}/about-xs2.png`;
import blog_1 from `${imagesRoot}/blog-1.png`;
import blog_2 from `${imagesRoot}/blog-2.png`;
import blog_3 from `${imagesRoot}/blog-3.png`;
import book_cover_mockup from `${imagesRoot}/book-cover-mockup.png`;
const imagesRoot = '../assets/images';
const imagesUrl = {
image : {
about_lg,
about_md,
},
icon : {
}
};
export default imagesUrl;

@ -4,7 +4,7 @@ import Footer from "../Home/Footer/index";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import History from "./History/index"; import History from "./History/index";
import book1 from "../../assets/images/book1.png"; import sciense_6 from "../../assets/images/sciense-6.png";
import analytics from "../../assets/icons/analytics.svg"; import analytics from "../../assets/icons/analytics.svg";
import danger from "../../assets/icons/danger.svg"; import danger from "../../assets/icons/danger.svg";
@ -36,7 +36,9 @@ export default class Activation extends Component {
<Navbar /> <Navbar />
<header className="activation__header d-flex flex-column align-items-center"> <header className="activation__header d-flex flex-column align-items-center">
<img src={analytics} alt="فعال سازی کتاب" /> <img src={analytics} alt="فعال سازی کتاب" />
<h1 style={{fontSize: fontSize.desktop.h1 }}>فعال سازی کتاب الکترونیک</h1> <h1 style={{ fontSize: fontSize.desktop.h1 }}>
فعال سازی کتاب الکترونیک
</h1>
</header> </header>
<div className="activation__description d-flex"> <div className="activation__description d-flex">
<span>.</span> <span>.</span>
@ -55,9 +57,14 @@ export default class Activation extends Component {
maxLength={9} maxLength={9}
autoComplete="off" autoComplete="off"
onChange={(e) => this.setState({ code: e.target.value })} onChange={(e) => this.setState({ code: e.target.value })}
style={{fontSize: fontSize.desktop.form }} style={{ fontSize: fontSize.desktop.form }}
/> />
<button style={{fontSize: fontSize.desktop.form }} type="submit">ثبت کد فعال سازی</button> <button
style={{ fontSize: fontSize.desktop.form }}
type="submit"
>
ثبت کد فعال سازی
</button>
</form> </form>
<div className="activation__support d-flex align-center"> <div className="activation__support d-flex align-center">
<span> <span>
@ -69,7 +76,7 @@ export default class Activation extends Component {
</p> </p>
</div> </div>
<div className="activation__history d-flex flex-column"> <div className="activation__history d-flex flex-column">
<h2 style={{fontSize: fontSize.desktop.h2 }}>آخرین مشاهدات</h2> <h2 style={{ fontSize: fontSize.desktop.h2 }}>آخرین مشاهدات</h2>
{data.map((item, i) => ( {data.map((item, i) => (
<History data={item} key={i} /> <History data={item} key={i} />
))} ))}
@ -136,7 +143,7 @@ Activation.defaultProps = {
title: "ریاضیات گسسته خیلی پیشرفته", title: "ریاضیات گسسته خیلی پیشرفته",
subTitle: "پایه هفتم ابتدایی", subTitle: "پایه هفتم ابتدایی",
status: "انجام شد", status: "انجام شد",
image: book1, image: sciense_6,
}, },
], ],
}; };

@ -6,7 +6,7 @@ import DiscoutCode from "./Discount/index";
import DeliveryMethod from "./DeliveryMethod/index"; import DeliveryMethod from "./DeliveryMethod/index";
import Factor from "./Factor/index"; import Factor from "./Factor/index";
import book1 from "../../assets/images/book1.png"; import sciense_6 from "../../assets/images/sciense-6.png";
import "./index.scss"; import "./index.scss";
@ -44,7 +44,7 @@ export default class Cart extends Component {
title: " گسسته ", title: " گسسته ",
subTitle: " گیرد", subTitle: " گیرد",
options: "بپشتی", options: "بپشتی",
image: book1, image: sciense_6,
slicePrice: 200000, slicePrice: 200000,
number: 1, number: 1,
price: 1899900, price: 1899900,
@ -54,7 +54,7 @@ export default class Cart extends Component {
title: "ریاضیات گسسته خیلی پیشرفته", title: "ریاضیات گسسته خیلی پیشرفته",
subTitle: "در این قسمت توضیح بسیار کوتاهی قرار می گیرد", subTitle: "در این قسمت توضیح بسیار کوتاهی قرار می گیرد",
options: "بستههای الحاقی: کیف، کفش و کوله پشتی", options: "بستههای الحاقی: کیف، کفش و کوله پشتی",
image: book1, image: sciense_6,
slicePrice: 300000, slicePrice: 300000,
number: 1, number: 1,
price: 2500000, price: 2500000,
@ -64,7 +64,7 @@ export default class Cart extends Component {
title: "ریاضیات گسسته خیلی پیشرفته", title: "ریاضیات گسسته خیلی پیشرفته",
subTitle: "در این قسمت توضیح بسیار کوتاهی قرار می گیرد", subTitle: "در این قسمت توضیح بسیار کوتاهی قرار می گیرد",
options: "بستههای الحاقی: کیف، کفش و کوله پشتی", options: "بستههای الحاقی: کیف، کفش و کوله پشتی",
image: book1, image: sciense_6,
slicePrice: 150000, slicePrice: 150000,
number: 1, number: 1,
price: 1000000, price: 1000000,
@ -110,7 +110,10 @@ export default class Cart extends Component {
<> <>
<div className="cart d-flex flex-column"> <div className="cart d-flex flex-column">
<Navbar /> <Navbar />
<div className="d-flex" style={{ width: "100%", flex: 1, marginBottom : 10 }}> <div
className="d-flex"
style={{ width: "100%", flex: 1, marginBottom: 10 }}
>
<section className="cart__right d-flex flex-column"> <section className="cart__right d-flex flex-column">
<header> <header>
<h1 style={{ fontSize: fontSize.desktop.h1 }}>سبد خرید</h1> <h1 style={{ fontSize: fontSize.desktop.h1 }}>سبد خرید</h1>

File diff suppressed because it is too large Load Diff

@ -4,10 +4,10 @@ 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 book6 from "../../assets/images/book6.png"; import sciense_6 from "../../assets/images/sciense-6.png";
import book7 from "../../assets/images/book7.png"; import sciense_8 from "../../assets/images/sciense-8.png";
import book8 from "../../assets/images/book8.png"; import sciense_9 from "../../assets/images/sciense-9.png";
import book9 from "../../assets/images/book9.png"; import sciense_7 from "../../assets/images/sciense-7.png";
import basket from "../../assets/icons/basket.png"; import basket from "../../assets/icons/basket.png";
import "./index.scss"; import "./index.scss";
@ -73,7 +73,9 @@ const Item = (props) => {
}} }}
> >
کتاب دیجیتال کتاب دیجیتال
{ !data.status.digital ? <img src={basket} alt="افزودن به سبد خرید" /> : null} {!data.status.digital ? (
<img src={basket} alt="افزودن به سبد خرید" />
) : null}
</Link> </Link>
<Link <Link
style={{ style={{
@ -83,7 +85,9 @@ const Item = (props) => {
}} }}
> >
واقعیت افزوده واقعیت افزوده
{ !data.status.ar ? <img src={basket} alt="افزودن به سبد خرید" /> : null} {!data.status.ar ? (
<img src={basket} alt="افزودن به سبد خرید" />
) : null}
</Link> </Link>
</div> </div>
</div> </div>
@ -95,7 +99,7 @@ MyBooks.defaultProps = {
{ {
id: 0, id: 0,
link: "", link: "",
imageUrl: book6, imageUrl: sciense_6,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
@ -104,7 +108,7 @@ MyBooks.defaultProps = {
{ {
id: 1, id: 1,
link: "", link: "",
imageUrl: book7, imageUrl: sciense_8,
status: { status: {
digital: false, digital: false,
ar: true, ar: true,
@ -113,7 +117,7 @@ MyBooks.defaultProps = {
{ {
id: 2, id: 2,
link: "", link: "",
imageUrl: book8, imageUrl: sciense_9,
status: { status: {
digital: true, digital: true,
ar: false, ar: false,
@ -122,7 +126,7 @@ MyBooks.defaultProps = {
{ {
id: 3, id: 3,
link: "", link: "",
imageUrl: book9, imageUrl: sciense_7,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
@ -131,7 +135,7 @@ MyBooks.defaultProps = {
{ {
id: 4, id: 4,
link: "", link: "",
imageUrl: book6, imageUrl: sciense_6,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
@ -140,7 +144,7 @@ MyBooks.defaultProps = {
{ {
id: 5, id: 5,
link: "", link: "",
imageUrl: book7, imageUrl: sciense_8,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
@ -149,7 +153,7 @@ MyBooks.defaultProps = {
{ {
id: 6, id: 6,
link: "", link: "",
imageUrl: book8, imageUrl: sciense_9,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
@ -158,7 +162,7 @@ MyBooks.defaultProps = {
{ {
id: 7, id: 7,
link: "", link: "",
imageUrl: book9, imageUrl: sciense_7,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,

@ -11,12 +11,12 @@ import AddToCart from "./AddToCart/index";
import HomeScroll from "../Home/HomeScroll/index"; import HomeScroll from "../Home/HomeScroll/index";
import HomeSlider from "../Home/HomeSlider/index"; import HomeSlider from "../Home/HomeSlider/index";
import book2 from "../../assets/images/book2.png"; import sciense_7 from "../../assets/images/sciense-7.png";
import book1 from '../../assets/images/book1.png'; import sciense_6 from "../../assets/images/sciense-6.png";
import book3 from '../../assets/images/book3.png'; import sciense_8 from "../../assets/images/sciense-8.png";
import book4 from '../../assets/images/book4.png'; import sciense_9 from "../../assets/images/sciense-9.png";
import book5 from '../../assets/images/book5.png'; import zist_10 from "../../assets/images/zist-10.png";
import film from '../../assets/Video/film.mp4'; import film from "../../assets/Video/film.mp4";
import "./index.scss"; import "./index.scss";
@ -25,11 +25,11 @@ const maxDesktopSize = 1250;
const fontSize = { const fontSize = {
desktop: { desktop: {
h1: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 70, h1: window.innerWidth > maxDesktopSize ? 20 : window.innerWidth / 70,
} },
} };
export default class Product extends Component { export default class Product extends Component {
render() { render() {
const { product,sameProducts } = this.props; const { product, sameProducts } = this.props;
return ( return (
<> <>
{window.innerWidth > 1000 ? ( {window.innerWidth > 1000 ? (
@ -47,7 +47,9 @@ export default class Product extends Component {
<AddToCart price={product.price} off={product.off} /> <AddToCart price={product.price} off={product.off} />
</header> </header>
<div className="product__comments d-flex flex-column"> <div className="product__comments d-flex flex-column">
<h1 style={{ fontSize: fontSize.desktop.h1 }}>نظرات خریداران</h1> <h1 style={{ fontSize: fontSize.desktop.h1 }}>
نظرات خریداران
</h1>
<div className="product__comments--list d-flex flex-column"> <div className="product__comments--list d-flex flex-column">
<Comment comment={product.comments[0]} /> <Comment comment={product.comments[0]} />
</div> </div>
@ -134,7 +136,7 @@ Product.defaultProps = {
data: [ data: [
{ {
id: 0, id: 0,
image: book1, image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "78.000", price: "78.000",
@ -143,7 +145,7 @@ Product.defaultProps = {
}, },
{ {
id: 1, id: 1,
image: book2, image: sciense_7,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "39.000", price: "39.000",
@ -152,7 +154,7 @@ Product.defaultProps = {
}, },
{ {
id: 2, id: 2,
image: book3, image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "21.000", price: "21.000",
@ -160,7 +162,7 @@ Product.defaultProps = {
}, },
{ {
id: 3, id: 3,
image: book4, image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "", price: "",
@ -168,7 +170,7 @@ Product.defaultProps = {
}, },
{ {
id: 4, id: 4,
image: book5, image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی", subTitle: "پایه هفتم ابتدایی",
price: "59.000", price: "59.000",
@ -176,7 +178,7 @@ Product.defaultProps = {
}, },
{ {
id: 5, id: 5,
image: book1, image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "78.000", price: "78.000",
@ -185,7 +187,7 @@ Product.defaultProps = {
}, },
{ {
id: 6, id: 6,
image: book2, image: sciense_7,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "39.000", price: "39.000",
@ -194,7 +196,7 @@ Product.defaultProps = {
}, },
{ {
id: 7, id: 7,
image: book3, image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "21.000", price: "21.000",
@ -203,7 +205,7 @@ Product.defaultProps = {
}, },
{ {
id: 8, id: 8,
image: book4, image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "", price: "",
@ -212,7 +214,7 @@ Product.defaultProps = {
}, },
{ {
id: 9, id: 9,
image: book5, image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی", subTitle: "پایه هفتم ابتدایی",
price: "59.000", price: "59.000",
@ -223,7 +225,7 @@ Product.defaultProps = {
}, },
product: { product: {
id: 1, id: 1,
image: book2, image: sciense_7,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "39.000", price: "39.000",
@ -243,10 +245,10 @@ Product.defaultProps = {
"کارت گرافیک مناسب جهت اجرای بازی", "کارت گرافیک مناسب جهت اجرای بازی",
], ],
gallery: [ gallery: [
{id : 0, value: film, type : 'film',}, { id: 0, value: film, type: "film" },
{id : 1, value: book1, type : 'image',}, { id: 1, value: sciense_6, type: "image" },
{id : 2, value: book2, type : 'image',}, { id: 2, value: sciense_7, type: "image" },
{value: book3, type : 'image',}, { value: sciense_8, type: "image" },
], ],
description: description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشت", "لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشت",
@ -257,7 +259,7 @@ Product.defaultProps = {
date: new Date(), date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون", text: "عالی بود. ممنون از سایت زیباتون",
score: 4, score: 4,
reply: 'ممنون از شما که به ما اعتماد کردید' reply: "ممنون از شما که به ما اعتماد کردید",
}, },
{ {
id: 1, id: 1,
@ -265,7 +267,7 @@ Product.defaultProps = {
date: new Date(), date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون", text: "عالی بود. ممنون از سایت زیباتون",
score: 2.5, score: 2.5,
reply : '', reply: "",
}, },
{ {
id: 2, id: 2,
@ -273,7 +275,7 @@ Product.defaultProps = {
date: new Date(), date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون", text: "عالی بود. ممنون از سایت زیباتون",
score: 5, score: 5,
reply : '', reply: "",
}, },
{ {
id: 3, id: 3,
@ -281,7 +283,7 @@ Product.defaultProps = {
date: new Date(), date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون", text: "عالی بود. ممنون از سایت زیباتون",
score: 3.7, score: 3.7,
reply : '', reply: "",
}, },
{ {
id: 4, id: 4,
@ -289,7 +291,7 @@ Product.defaultProps = {
date: new Date(), date: new Date(),
text: "عالی بود. ممنون از سایت زیباتون", text: "عالی بود. ممنون از سایت زیباتون",
score: 2, score: 2,
reply : '', reply: "",
}, },
], ],
}, },
@ -321,7 +323,6 @@ const Identifier = (props) => {
data={props.item.data} data={props.item.data}
/> />
) : null} ) : null}
</> </>
); );
}; };

@ -1,29 +1,29 @@
.mobile-product{ .mobile-product {
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: 90px;
overflow-x: hidden; overflow-x: hidden;
&__header{ &__header {
width: 100%; width: 100%;
img{ img {
height: calc(100vh / 2.7); height: calc(100vh / 2.7);
} }
h1{ h1 {
margin-top: 10px; margin-top: 10px;
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 20); font-size: calc(100vw / 20);
color: #7dc241; color: #7dc241;
letter-spacing: -1px; letter-spacing: -1px;
} }
h2{ h2 {
font-family: numeralMedium; font-family: numeralMedium;
font-size: calc(100vw / 28); font-size: calc(100vw / 28);
color: #6f7074; color: #6f7074;
} }
a{ a {
border: 0px; border: 0px;
font-family: numeralMedium; font-family: numeralMedium;
font-size: calc(100vw / 25); font-size: calc(100vw / 25);
@ -33,29 +33,29 @@
letter-spacing: -1px; letter-spacing: -1px;
text-decoration: none; text-decoration: none;
} }
&--purchase{ &--purchase {
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-bottom-left-radius: 8px; border-bottom-left-radius: 8px;
background-color: #00cc69; background-color: #00cc69;
color: white !important; color: white !important;
} }
&--sampleButton{ &--sampleButton {
border-top-right-radius: 8px; border-top-right-radius: 8px;
border-bottom-right-radius: 8px; border-bottom-right-radius: 8px;
background-color: #efefef; background-color: #efefef;
color: #6f7074 !important; color: #6f7074 !important;
} }
} }
&__abstraction{ &__abstraction {
margin-top: 30px; margin-top: 30px;
width: 100%; width: 100%;
h1{ h1 {
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 22); font-size: calc(100vw / 22);
color: #6f7074; color: #6f7074;
letter-spacing: -1px; letter-spacing: -1px;
} }
p{ p {
font-family: numeralLight; font-family: numeralLight;
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
color: #6f7074; color: #6f7074;
@ -63,24 +63,24 @@
text-align: justify; text-align: justify;
} }
} }
&__modules{ &__modules {
margin-top: 20px; margin-top: 20px;
width: 100%; width: 100%;
padding: 20px 10px; padding: 20px 10px;
background-color: #baffdc2f; background-color: #baffdc2f;
border-radius: 10px; border-radius: 10px;
h1{ h1 {
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 28); font-size: calc(100vw / 28);
color: #02733c; color: #02733c;
letter-spacing: -1px; letter-spacing: -1px;
} }
ul{ ul {
list-style: none; list-style: none;
padding: 0px; padding: 0px;
margin: 0px; margin: 0px;
margin-top: 10px; margin-top: 10px;
li{ li {
font-family: numeralLight; font-family: numeralLight;
font-size: calc(100vw / 28); font-size: calc(100vw / 28);
color: #02733c; color: #02733c;
@ -88,24 +88,24 @@
} }
} }
} }
&__tips{ &__tips {
margin-top: 20px; margin-top: 20px;
width: 100%; width: 100%;
padding: 20px 10px; padding: 20px 10px;
background-color: #1f6fb528; background-color: #1f6fb528;
border-radius: 10px; border-radius: 10px;
h1{ h1 {
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 28); font-size: calc(100vw / 28);
color: #074f8b; color: #074f8b;
letter-spacing: -1px; letter-spacing: -1px;
} }
ul{ ul {
list-style: none; list-style: none;
padding: 0px; padding: 0px;
margin: 0px; margin: 0px;
margin-top: 10px; margin-top: 10px;
li{ li {
font-family: numeralLight; font-family: numeralLight;
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
color: #074f8b; color: #074f8b;
@ -114,10 +114,10 @@
} }
} }
} }
&__description{ &__description {
width: 100%; width: 100%;
margin-top: 20px; margin-top: 20px;
p{ p {
font-family: numeralLight; font-family: numeralLight;
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
color: #6f7074; color: #6f7074;
@ -125,17 +125,17 @@
text-align: justify; text-align: justify;
} }
} }
&__comments{ &__comments {
max-width: 100%; max-width: 100%;
margin-top: 30px; margin-top: 30px;
h1{ h1 {
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 22); font-size: calc(100vw / 22);
color: #6f7074; color: #6f7074;
letter-spacing: -1px; letter-spacing: -1px;
margin-bottom: 30px; margin-bottom: 30px;
} }
&--list{ &--list {
width: 100vw; width: 100vw;
overflow-x: scroll !important; overflow-x: scroll !important;
transform: translateX(10px); transform: translateX(10px);
@ -143,31 +143,31 @@
} }
} }
.product {
.product{
width: 100vw; width: 100vw;
max-width: 1250px; max-width: 1250px;
margin: 0px auto; margin: 0px auto;
padding : 0px 10px 40px; padding: 0px 10px 40px;
direction: rtl; direction: rtl;
overflow-x: hidden; overflow-x: hidden;
min-height: calc(100vh - 288px); min-height: calc(100vh - 288px);
&__header{ padding-top: 100px;
&__header {
margin-top: 30px; margin-top: 30px;
width: 100%; width: 100%;
height: 470px; height: 470px;
padding: 0px 10px; padding: 0px 10px;
} }
&__comments{ &__comments {
width: 100%; width: 100%;
margin-top: 30px; margin-top: 30px;
h1{ h1 {
font-family: numeralBold; font-family: numeralBold;
color: #6f7074; color: #6f7074;
letter-spacing: -1px; letter-spacing: -1px;
margin-bottom: 30px; margin-bottom: 30px;
} }
&--list{ &--list {
width: 100%; width: 100%;
} }
} }

@ -10,20 +10,19 @@ import List from "./List/index";
import Sort from "./Sort/index"; import Sort from "./Sort/index";
import Filters from "./Filters/index"; import Filters from "./Filters/index";
import book1 from "../../assets/images/book1.png"; import sciense_6 from "../../assets/images/sciense-6.png";
import book2 from "../../assets/images/book2.png"; import sciense_7 from "../../assets/images/sciense-7.png";
import book3 from "../../assets/images/book3.png"; import sciense_8 from "../../assets/images/sciense-8.png";
import book4 from "../../assets/images/book4.png"; import sciense_9 from "../../assets/images/sciense-9.png";
import book5 from "../../assets/images/book5.png"; import zist_10 from "../../assets/images/zist-10.png";
import "./index.scss"; import "./index.scss";
export default class Products extends Component { export default class Products extends Component {
state = { state = {
selectedSort : null, selectedSort: null,
selectedFilters : { selectedFilters: {
level : [], level: [],
subject : [], subject: [],
}, },
firstFilters: [ firstFilters: [
{ id: 0, value: "محبوب ترین" }, { id: 0, value: "محبوب ترین" },
@ -52,7 +51,7 @@ export default class Products extends Component {
{window.innerWidth > 1000 ? ( {window.innerWidth > 1000 ? (
<> <>
<div className="products d-flex flex-column"> <div className="products d-flex flex-column">
<Navbar page={'products'} /> <Navbar page={"products"} />
<Breadcrumbs /> <Breadcrumbs />
<div className="products__body d-flex"> <div className="products__body d-flex">
<Filters parent={this} /> <Filters parent={this} />
@ -68,7 +67,7 @@ export default class Products extends Component {
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<> <>
<div className="mobile-products d-flex flex-column"> <div className="mobile-products d-flex flex-column">
<Navbar page={'products'} /> <Navbar page={"products"} />
<div className="mobile-products__filters d-flex"> <div className="mobile-products__filters d-flex">
<div className="d-flex"> <div className="d-flex">
<Select name="first" options={firstFilters} parent={this} /> <Select name="first" options={firstFilters} parent={this} />
@ -91,32 +90,27 @@ export default class Products extends Component {
} }
Products.defaultProps = { Products.defaultProps = {
sortItems : [ sortItems: [
'پربازدیدترین', "پربازدیدترین",
'پرفروش ترین', "پرفروش ترین",
'گران ترین', "گران ترین",
'ارزان ترین', "ارزان ترین",
'جدیدترین', "جدیدترین",
'بزودی', "بزودی",
], ],
subjects: [ subjects: [
'فیزیک', "فیزیک",
'زیست شناسی', "زیست شناسی",
'شیمی آلی', "شیمی آلی",
'روانشناسی', "روانشناسی",
'علوم تجربی', "علوم تجربی",
'دین و زندگی', "دین و زندگی",
],
levels : [
'اول',
'دوم',
'سوم',
'دهم',
], ],
levels: ["اول", "دوم", "سوم", "دهم"],
products: [ products: [
{ {
id: 0, id: 0,
image: book1, image: sciense_6,
title: "کتاب شیمی آلی", title: "کتاب شیمی آلی",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "78.000", price: "78.000",
@ -129,7 +123,7 @@ Products.defaultProps = {
}, },
{ {
id: 1, id: 1,
image: book2, image: sciense_7,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "39.000", price: "39.000",
@ -142,7 +136,7 @@ Products.defaultProps = {
}, },
{ {
id: 2, id: 2,
image: book3, image: sciense_8,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "21.000", price: "21.000",
@ -154,7 +148,7 @@ Products.defaultProps = {
}, },
{ {
id: 3, id: 3,
image: book4, image: sciense_9,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "", price: "",
@ -166,7 +160,7 @@ Products.defaultProps = {
}, },
{ {
id: 4, id: 4,
image: book5, image: zist_10,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه هفتم ابتدایی", subTitle: "پایه هفتم ابتدایی",
price: "59.000", price: "59.000",
@ -178,7 +172,7 @@ Products.defaultProps = {
}, },
{ {
id: 5, id: 5,
image: book1, image: sciense_6,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "78.000", price: "78.000",
@ -191,7 +185,7 @@ Products.defaultProps = {
}, },
{ {
id: 6, id: 6,
image: book2, image: sciense_7,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "39.000", price: "39.000",
@ -204,7 +198,7 @@ Products.defaultProps = {
}, },
{ {
id: 7, id: 7,
image: book3, image: sciense_8,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
price: "21.000", price: "21.000",
@ -217,7 +211,7 @@ Products.defaultProps = {
}, },
{ {
id: 8, id: 8,
image: book4, image: sciense_9,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی", subTitle: "پایه دهم ابتدایی",
price: "", price: "",
@ -230,7 +224,7 @@ Products.defaultProps = {
}, },
{ {
id: 9, id: 9,
image: book5, image: zist_10,
title: "کتاب علوم تجربی", title: "کتاب علوم تجربی",
subTitle: "پایه هفتم ابتدایی", subTitle: "پایه هفتم ابتدایی",
price: "59.000", price: "59.000",

@ -11,7 +11,7 @@ import BookContent from "./BookContent/index";
import NightsStayOutlinedIcon from "@material-ui/icons/NightsStayOutlined"; import NightsStayOutlinedIcon from "@material-ui/icons/NightsStayOutlined";
import exit from "../../assets/icons/exit.svg"; import exit from "../../assets/icons/exit.svg";
import book2 from "../../assets/images/book2.png"; import sciense_7 from "../../assets/images/sciense-7.png";
import "./index.scss"; import "./index.scss";
@ -70,14 +70,10 @@ export default class QR extends Component {
<> <>
{window.innerWidth > 1000 ? ( {window.innerWidth > 1000 ? (
<> <>
<div <div className="qr d-flex flex-column">
className="qr d-flex flex-column"
>
<Navbar /> <Navbar />
<div className="d-flex"> <div className="d-flex">
<section <section className="qr__sidebar d-flex flex-column p-2">
className="qr__sidebar d-flex flex-column p-2"
>
<header className="qr__sidebar--header d-flex"> <header className="qr__sidebar--header d-flex">
<div className="qr__sidebar--header__right d-flex"> <div className="qr__sidebar--header__right d-flex">
<img src={QR.image} alt={QR.title} /> <img src={QR.image} alt={QR.title} />
@ -102,9 +98,7 @@ export default class QR extends Component {
<SubjectsDropdown /> <SubjectsDropdown />
<BookContent data={QR.data} /> <BookContent data={QR.data} />
</section> </section>
<section <section className="qr__content d-flex flex-column">
className="qr__content d-flex flex-column"
>
<header className="qr__content--header d-flex justify-content-end"> <header className="qr__content--header d-flex justify-content-end">
<div className="qr__content--header__tools d-flex"> <div className="qr__content--header__tools d-flex">
<span <span
@ -150,13 +144,28 @@ export default class QR extends Component {
<div className="d-flex pt-3"> <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='خروج' /> <img src={exit} alt="خروج" />
<button>نمایش تمامی محتواها</button> <button>نمایش تمامی محتواها</button>
<a href="#voice" className="mobile-qr__buttons--voice mobile-qr__buttons--media"></a> <a
<a href="#video" className="mobile-qr__buttons--video mobile-qr__buttons--media"></a> href="#voice"
<a href="#ppt" className="mobile-qr__buttons--ppt mobile-qr__buttons--media"></a> className="mobile-qr__buttons--voice mobile-qr__buttons--media"
<a href="#pdf" className="mobile-qr__buttons--pdf mobile-qr__buttons--media"></a> ></a>
<a href="#links" className="mobile-qr__buttons--attachment 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>
<div className="mobile-qr__content d-flex flex-column"> <div className="mobile-qr__content d-flex flex-column">
{QR.data.map((item, i) => ( {QR.data.map((item, i) => (
@ -175,7 +184,7 @@ export default class QR extends Component {
QR.defaultProps = { QR.defaultProps = {
QR: { QR: {
id: 1, id: 1,
image: book2, image: sciense_7,
title: "منفجر کردن مغز خود را به ما بسپارید", title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی", subTitle: "پایه ششم ابتدایی",
date: new Date(), date: new Date(),

@ -6,7 +6,7 @@ import Scanner from "./Scanner/index";
import LastQr from "./LastQr/index"; import LastQr from "./LastQr/index";
import ReplayIcon from "@material-ui/icons/Replay"; import ReplayIcon from "@material-ui/icons/Replay";
import book1 from "../../assets/images/book1.png"; import sciense_6 from "../../assets/images/sciense-6.png";
import "./index.scss"; import "./index.scss";
export default class QRScan extends Component { export default class QRScan extends Component {
@ -46,7 +46,10 @@ export default class QRScan extends Component {
<div className="mobile-qr-scan__camera--shapeRight mobile-qr-scan__camera--shape d-flex"></div> <div className="mobile-qr-scan__camera--shapeRight mobile-qr-scan__camera--shape d-flex"></div>
<div className="mobile-qr-scan__camera--shapeCenter d-flex"></div> <div className="mobile-qr-scan__camera--shapeCenter d-flex"></div>
{this.state.value !== null ? ( {this.state.value !== null ? (
<div style={{zIndex: 1000 }} onClick={() => this.setState({ value: null })}> <div
style={{ zIndex: 1000 }}
onClick={() => this.setState({ value: null })}
>
<ReplayIcon style={{ fontSize: 40, color: "grey" }} /> <ReplayIcon style={{ fontSize: 40, color: "grey" }} />
</div> </div>
) : ( ) : (
@ -82,7 +85,7 @@ QRScan.defaultProps = {
title: "ریاضیات گسسته خیلی پیشرفته", title: "ریاضیات گسسته خیلی پیشرفته",
subTitle: "پایه هفتم ابتدایی", subTitle: "پایه هفتم ابتدایی",
page: 13, page: 13,
image: book1, image: sciense_6,
}, },
], ],
}; };

@ -3028,6 +3028,13 @@ babel-plugin-polyfill-regenerator@^0.2.2:
dependencies: dependencies:
"@babel/helper-define-polyfill-provider" "^0.2.2" "@babel/helper-define-polyfill-provider" "^0.2.2"
babel-plugin-root-import@^6.6.0:
version "6.6.0"
resolved "https://registry.yarnpkg.com/babel-plugin-root-import/-/babel-plugin-root-import-6.6.0.tgz#85940840f308a8c292f66ca0b5bdd314046273ed"
integrity sha512-SPzVOHd7nDh5loZwZBxtX/oOu1MXeKjTkz+1VnnzLWC0dk8sJIGC2IDQ2uWIBjE5mUtXlQ35MTHSqN0Xn7qHrg==
dependencies:
slash "^3.0.0"
"babel-plugin-styled-components@>= 1.12.0": "babel-plugin-styled-components@>= 1.12.0":
version "1.12.0" version "1.12.0"
resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.12.0.tgz#1dec1676512177de6b827211e9eda5a30db4f9b9" resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.12.0.tgz#1dec1676512177de6b827211e9eda5a30db4f9b9"

Loading…
Cancel
Save