diff --git a/src/assets/images/book6.png b/src/assets/images/book6.png
new file mode 100644
index 0000000..0d08aad
Binary files /dev/null and b/src/assets/images/book6.png differ
diff --git a/src/assets/images/book7.png b/src/assets/images/book7.png
new file mode 100644
index 0000000..6cfc7a6
Binary files /dev/null and b/src/assets/images/book7.png differ
diff --git a/src/assets/images/book8.png b/src/assets/images/book8.png
new file mode 100644
index 0000000..2f211d0
Binary files /dev/null and b/src/assets/images/book8.png differ
diff --git a/src/assets/images/book9.png b/src/assets/images/book9.png
new file mode 100644
index 0000000..fcb1936
Binary files /dev/null and b/src/assets/images/book9.png differ
diff --git a/src/views/Home/HomeStatic/Flex/index.js b/src/views/Home/HomeStatic/Flex/index.js
index c745f8b..c62ded3 100644
--- a/src/views/Home/HomeStatic/Flex/index.js
+++ b/src/views/Home/HomeStatic/Flex/index.js
@@ -1,4 +1,5 @@
import React from 'react';
+import {Link} from 'react-router-dom';
const maxMobileSize = 550;
@@ -18,7 +19,7 @@ export default function Flex(props){
}
return(
-
+
{data.title}
{
@@ -28,7 +29,7 @@ export default function Flex(props){
{data.subTitle}
-
+
);
}
diff --git a/src/views/Home/HomeStatic/Simple/index.js b/src/views/Home/HomeStatic/Simple/index.js
index 61dedc2..2ae67e6 100644
--- a/src/views/Home/HomeStatic/Simple/index.js
+++ b/src/views/Home/HomeStatic/Simple/index.js
@@ -1,4 +1,5 @@
import React from 'react';
+import {Link} from 'react-router-dom';
const maxMobileSize = 550;
@@ -29,11 +30,11 @@ export default function Simple(props){
alignItems: data.alignItems
};
return(
-
+
);
}
diff --git a/src/views/Home/HomeStatic/Vitrin/index.js b/src/views/Home/HomeStatic/Vitrin/index.js
index 6e1f020..ddc6810 100644
--- a/src/views/Home/HomeStatic/Vitrin/index.js
+++ b/src/views/Home/HomeStatic/Vitrin/index.js
@@ -32,7 +32,7 @@ export default function Vitrin(props){
))
}
- مشاهده بیشتر
+ مشاهده بیشتر
);
diff --git a/src/views/Home/HomeStatic/index.scss b/src/views/Home/HomeStatic/index.scss
index dcddce9..920a017 100644
--- a/src/views/Home/HomeStatic/index.scss
+++ b/src/views/Home/HomeStatic/index.scss
@@ -31,6 +31,7 @@
&__flex{
padding: 20px 10px;
justify-content: space-around;
+ text-decoration: none;
img {
// margin-right: 20px;
max-height: 55px;
@@ -65,16 +66,19 @@
border-radius: 10px;
}
}
- span{
+ a{
+ text-decoration: none;
font-family: numeralLight;
align-items: flex-end;
margin-bottom: 5px;
letter-spacing: -1px;
margin-right: 5px;
+ color: white;
}
}
&__simple{
// padding: 0px 10px;
+ text-decoration: none;
min-height: 50px;
div{
width: 100%;
diff --git a/src/views/Home/index.js b/src/views/Home/index.js
index d7cbecb..917b88b 100644
--- a/src/views/Home/index.js
+++ b/src/views/Home/index.js
@@ -178,7 +178,7 @@ Home.defaultProps = {
design: "flex",
title: "QR خوان",
subTitle: "در صفحات کتاب هوشمند",
- link: '',
+ link: '/qr-scan',
badge : '',
flex : 1,
fontSize : 'large',
@@ -195,7 +195,7 @@ Home.defaultProps = {
design: "flex",
title: "واقعیت افزوده",
subTitle: "توضیحات مختصر در این رابطه",
- link: '',
+ link: '/ar-scan',
badge : '',
flex : 1,
fontSize : 'large',
@@ -234,11 +234,11 @@ Home.defaultProps = {
angle: '180deg'
},
design: "simple",
- title: "واقعیت افزوده",
+ title: "کتابهای من",
subTitle: "",
justifyContent: 'flex-start',
alignItems: 'center',
- link: '',
+ link: '/mybooks',
badge : '',
flex : 1,
fontSize : 'large',
@@ -264,7 +264,7 @@ Home.defaultProps = {
subTitle: "",
justifyContent: 'center',
alignItems: 'center',
- link: '',
+ link: '/blog',
badge : '',
flex : 1.2,
fontSize : 'normal',
@@ -287,7 +287,7 @@ Home.defaultProps = {
{ id: 1, imageUrl: book2 },
{ id: 2, imageUrl: book3},
],
- link: '',
+ link: '/products',
badge : '',
flex : 2,
fontSize : 'large',
@@ -318,7 +318,7 @@ Home.defaultProps = {
subTitle: "",
justifyContent: 'center',
alignItems: 'center',
- link: '',
+ link: '/contact',
badge : '',
flex : 1,
fontSize : 'normal',
@@ -337,7 +337,7 @@ Home.defaultProps = {
subTitle: "",
justifyContent: 'center',
alignItems: 'center',
- link: '',
+ link: '/profile',
badge : '',
flex : 1,
fontSize : 'normal',
@@ -358,7 +358,7 @@ Home.defaultProps = {
subTitle: "",
justifyContent: 'center',
alignItems: 'center',
- link: '',
+ link: '/activation',
badge : '',
flex : 1,
fontSize : 'large',
diff --git a/src/views/MyBooks/index.js b/src/views/MyBooks/index.js
new file mode 100644
index 0000000..4e33104
--- /dev/null
+++ b/src/views/MyBooks/index.js
@@ -0,0 +1,168 @@
+import React from "react";
+import { Link } from "react-router-dom";
+
+import Navbar from "../Home/Navbar/index";
+import Footer from "../Home/Footer/index";
+
+import book6 from "../../assets/images/book6.png";
+import book7 from "../../assets/images/book7.png";
+import book8 from "../../assets/images/book8.png";
+import book9 from "../../assets/images/book9.png";
+import basket from "../../assets/icons/basket.png";
+
+import "./index.scss";
+
+const maxDesktopSize = 1250;
+const maxMobileSize = 550;
+
+const fontSize = {
+ mobile: {
+ h1: window.innerWidth > maxMobileSize ? 24 : window.innerWidth / 15,
+ a: window.innerHeight > maxMobileSize ? 15 : window.innerWidth / 30,
+ },
+};
+
+export default class MyBooks extends React.Component {
+ render() {
+ const { books } = this.props;
+ return (
+ <>
+ {window.innerWidth > 1000 ? (
+ <>
+
+
+
+
+ >
+ ) : null}
+ {window.innerWidth < 1000 ? (
+ <>
+
+
+
کتابهای من
+
+ {books.map((item, i) => (
+
+ ))}
+
+
+ >
+ ) : null}
+ >
+ );
+ }
+}
+
+const Item = (props) => {
+ const { data, id } = props;
+ return (
+
+
+
+
+ کتاب دیجیتال
+ { !data.status.digital ?
: null}
+
+
+ واقعیت افزوده
+ { !data.status.ar ?
: null}
+
+
+
+ );
+};
+
+MyBooks.defaultProps = {
+ books: [
+ {
+ id: 0,
+ link: "",
+ imageUrl: book6,
+ status: {
+ digital: true,
+ ar: true,
+ },
+ },
+ {
+ id: 1,
+ link: "",
+ imageUrl: book7,
+ status: {
+ digital: false,
+ ar: true,
+ },
+ },
+ {
+ id: 2,
+ link: "",
+ imageUrl: book8,
+ status: {
+ digital: true,
+ ar: false,
+ },
+ },
+ {
+ id: 3,
+ link: "",
+ imageUrl: book9,
+ status: {
+ digital: true,
+ ar: true,
+ },
+ },
+ {
+ id: 4,
+ link: "",
+ imageUrl: book6,
+ status: {
+ digital: true,
+ ar: true,
+ },
+ },
+ {
+ id: 5,
+ link: "",
+ imageUrl: book7,
+ status: {
+ digital: true,
+ ar: true,
+ },
+ },
+ {
+ id: 6,
+ link: "",
+ imageUrl: book8,
+ status: {
+ digital: true,
+ ar: true,
+ },
+ },
+ {
+ id: 7,
+ link: "",
+ imageUrl: book9,
+ status: {
+ digital: true,
+ ar: true,
+ },
+ },
+ ],
+};
diff --git a/src/views/MyBooks/index.scss b/src/views/MyBooks/index.scss
new file mode 100644
index 0000000..915c241
--- /dev/null
+++ b/src/views/MyBooks/index.scss
@@ -0,0 +1,62 @@
+.mybooks{
+ width: 100vw;
+ max-width: 1250px;
+ margin: 0px auto;
+ padding : 0px 10px;
+ direction: rtl;
+ min-height: calc(100vh - 288px);
+}
+
+.mobile-mybooks{
+ width: 100vw;
+ max-width: 600px;
+ margin: 0px auto;
+ padding: 0px;
+ direction: rtl;
+ overflow-x: hidden;
+ padding-top: 70px;
+ h1{
+ padding: 0px 10px;
+ font-family: numeralBold;
+ color: #6F7074;
+ margin-bottom: 10px;
+ }
+ &__item{
+ background-color: #F2F2F2;
+ width: calc(100vw / 2 - 15px);
+ margin: 5px;
+ border-top-left-radius: 30px;
+ border-top-right-radius: 30px;
+ margin-bottom: 20px;
+ & img{
+ width: 100%;
+ height: calc(100vh / 3.5);
+ border-radius: 30px;
+ max-height: 200px;
+ margin-bottom: 10px;
+ }
+ &--buttons{
+ padding: 5px 9px;
+ a {
+ text-decoration: none;
+ width: 100%;
+ padding: 8px;
+ font-family: numeralLight;
+ margin-bottom: 10px;
+ border-radius: 10px;
+ text-align: center;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ img{
+ position: absolute;
+ top: calc(50% - 8px);
+ left: 5px;
+ width: 20px;
+ height: 20px;
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/Products/BreadCrumb/index.js b/src/views/Products/BreadCrumb/index.js
new file mode 100644
index 0000000..94cd4c7
--- /dev/null
+++ b/src/views/Products/BreadCrumb/index.js
@@ -0,0 +1,32 @@
+import React from 'react';
+import Breadcrumbs from '@material-ui/core/Breadcrumbs';
+import {Link} from 'react-router-dom';
+
+import './index.scss';
+
+function handleClick(event) {
+ event.preventDefault();
+ console.info('You clicked a breadcrumb.');
+}
+
+const maxDesktopSize = 1250;
+const maxMobileSize = 650;
+
+const fontSize = {
+ desktop: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 90,
+ mobile : window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 25,
+};
+
+export default function ActiveLastBreadcrumb() {
+ return (
+
+ 1000 ? fontSize.desktop : fontSize.mobile}} to={'/'} onClick={handleClick}>
+ صفحه اصلی
+
+ 1000 ? fontSize.desktop : fontSize.mobile, color: '#00CC69'}} to="/products" onClick={handleClick}>
+ محصولات
+
+
+ );
+}
+
diff --git a/src/views/Products/BreadCrumb/index.scss b/src/views/Products/BreadCrumb/index.scss
new file mode 100644
index 0000000..e10f243
--- /dev/null
+++ b/src/views/Products/BreadCrumb/index.scss
@@ -0,0 +1,8 @@
+.MuiBreadcrumbs-li{
+ a {
+ text-decoration: none;
+ font-family: numeralLight;
+ color: #6F7074;
+ letter-spacing: -1px;
+ }
+}
diff --git a/src/views/Products/Filters/AppliedFilters/index.js b/src/views/Products/Filters/AppliedFilters/index.js
new file mode 100644
index 0000000..2c65a73
--- /dev/null
+++ b/src/views/Products/Filters/AppliedFilters/index.js
@@ -0,0 +1,40 @@
+import React from 'react';
+import CloseIcon from '@material-ui/icons/Close';
+
+import './index.scss';
+
+const maxDesktopSize = 1250;
+
+const fontSize = {
+ h2 : window.innerWidth > maxDesktopSize ? 13 : window.innerWidth / 85,
+}
+export default class AppliedFilters extends React.Component {
+ render() {
+ const {data} = this.props;
+ return(
+
+
+
+ {
+ data.map((item,i) => (
+
+ ))
+ }
+
+
+ );
+ }
+}
+
+const Item = (props) => {
+ const {data} = props;
+ return(
+
+ );
+}
\ No newline at end of file
diff --git a/src/views/Products/Filters/AppliedFilters/index.scss b/src/views/Products/Filters/AppliedFilters/index.scss
new file mode 100644
index 0000000..c34368b
--- /dev/null
+++ b/src/views/Products/Filters/AppliedFilters/index.scss
@@ -0,0 +1,27 @@
+.products-filters-applied {
+ width: 100%;
+ margin-bottom: 20px;
+ &__header {
+ h2 {
+ font-family: numeralBold;
+ margin: 0px;
+ color: #373737;
+ }
+
+ span {
+ width: 3px;
+ border-radius: 100px;
+ background-color: #17dfff;
+ height: 100%;
+ margin-left: 5px;
+ min-height: 20px;
+ }
+ }
+ &__items {
+ margin-top: 10px;
+ box-shadow: 0px 0px 10px #70707028;
+ border-radius: 8px;
+ min-height: 30px;
+ padding: 10px 5px;
+ }
+}
diff --git a/src/views/Products/Filters/TypicalFilters/index.js b/src/views/Products/Filters/TypicalFilters/index.js
new file mode 100644
index 0000000..08f2a2b
--- /dev/null
+++ b/src/views/Products/Filters/TypicalFilters/index.js
@@ -0,0 +1,49 @@
+import React from 'react';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+import Checkbox from '@material-ui/core/Checkbox';
+
+import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
+import CheckBoxIcon from '@material-ui/icons/CheckBox';
+import CloseIcon from '@material-ui/icons/Close';
+
+import './index.scss';
+
+const maxDesktopSize = 1250;
+
+const fontSize = {
+ h2 : window.innerWidth > maxDesktopSize ? 13 : window.innerWidth / 85,
+ strong: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 90,
+}
+export default class TypicalFilters extends React.Component {
+ render() {
+ const {data, title, theme} = this.props;
+ return(
+
+
+
+ {
+ data.map((item,i) => (
+
+ ))
+ }
+
+
+ );
+ }
+}
+
+const Item = (props) => {
+ const {data} = props;
+ return(
+
+ } checkedIcon={} name="checkedH" />}
+ label=""
+ />
+ {data}
+
+ );
+}
\ No newline at end of file
diff --git a/src/views/Products/Filters/TypicalFilters/index.scss b/src/views/Products/Filters/TypicalFilters/index.scss
new file mode 100644
index 0000000..b3a494d
--- /dev/null
+++ b/src/views/Products/Filters/TypicalFilters/index.scss
@@ -0,0 +1,39 @@
+.products-filters-typical{
+ width: 100%;
+ margin-bottom: 20px;
+ &__header{
+ h2{
+ font-family: numeralBold;
+ margin: 0px;
+ color: #373737;
+ }
+
+ span{
+ width: 4px;
+ border-radius: 4px;
+ height: 100%;
+ margin-left: 5px;
+ min-height: 20px;
+ }
+ }
+ &__items {
+ margin-top: 10px;
+ box-shadow: 0px 0px 10px #70707028;
+ border-radius: 8px;
+ min-height: 30px;
+ padding: 10px 5px;
+ .MuiFormControlLabel-root{
+ margin: 0px;
+ }
+ .MuiCheckbox-root{
+ padding: 0px;
+
+ }
+ strong{
+ font-weight: 100;
+ color: #6F7074;
+ font-family: numeralLight;
+ margin-right: 10px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/Products/Filters/index.js b/src/views/Products/Filters/index.js
new file mode 100644
index 0000000..102b859
--- /dev/null
+++ b/src/views/Products/Filters/index.js
@@ -0,0 +1,21 @@
+import React from 'react';
+
+import AppliedFiltesrs from './AppliedFilters/index';
+import TypicalFilters from './TypicalFilters/index';
+
+import './index.scss';
+export default class Filtesrs extends React.Component {
+ render() {
+ const {parent} = this.props;
+ return(
+
+ {
+ parent.state.selectedFilters.length !== 0 ?
+
: null
+ }
+
+
+
+ );
+ }
+}
\ No newline at end of file
diff --git a/src/views/Products/Filters/index.scss b/src/views/Products/Filters/index.scss
new file mode 100644
index 0000000..64512b5
--- /dev/null
+++ b/src/views/Products/Filters/index.scss
@@ -0,0 +1,3 @@
+.products-filters{
+ flex: 1;
+}
\ No newline at end of file
diff --git a/src/views/Products/List/index.js b/src/views/Products/List/index.js
new file mode 100644
index 0000000..6d7cc7d
--- /dev/null
+++ b/src/views/Products/List/index.js
@@ -0,0 +1,18 @@
+import React from 'react';
+import Product from '../Product/index';
+
+import './index.scss';
+export default class List extends React.Component {
+ render() {
+ const {parent} = this.props;
+ return(
+
+ {
+ parent.props.products.map((item,i) => (
+
+ ))
+ }
+
+ );
+ }
+}
\ No newline at end of file
diff --git a/src/views/Products/List/index.scss b/src/views/Products/List/index.scss
new file mode 100644
index 0000000..00a2498
--- /dev/null
+++ b/src/views/Products/List/index.scss
@@ -0,0 +1,3 @@
+.products-list{
+ padding: 20px 20px;
+}
\ No newline at end of file
diff --git a/src/views/Products/Product/index.js b/src/views/Products/Product/index.js
index 4d5a392..51a4b71 100644
--- a/src/views/Products/Product/index.js
+++ b/src/views/Products/Product/index.js
@@ -4,13 +4,20 @@ import { Link } from "react-router-dom";
import "./index.scss";
const maxMobileSize = 550;
+const maxDesktopSize = 1250;
const fontSize = {
mobile : {
h1: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 26,
h2: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 34,
div: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 32,
- }
+ },
+ desktop : {
+ h1: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 70,
+ div: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 85,
+ old: window.innerWidth > maxDesktopSize ? 9 : window.innerWidth / 120,
+ },
+
}
export default class Product extends Component {
render() {
@@ -45,6 +52,33 @@ export default class Product extends Component {
) : null}
+ {window.innerWidth > 1000 ? (
+
+
+
+ {product.title + ' ' + product.subTitle}
+ {product.price ? (
+
+ {product.oldPrice ? (
+
+
+ {product.oldPrice} تومان
+
+
+
+ ) : null}
+
+ {product.price} تومان
+
+
+ ) : (
+
+ ناموجود
+
+ )}
+
+
+ ) : null}
>
);
}
diff --git a/src/views/Products/Product/index.scss b/src/views/Products/Product/index.scss
index c515fac..15e383d 100644
--- a/src/views/Products/Product/index.scss
+++ b/src/views/Products/Product/index.scss
@@ -56,4 +56,59 @@
font-family: numeralBold;
}
}
+}
+
+.products-product{
+ width: calc(100% / 4);
+ padding: 10px;
+ margin-bottom: 20px;
+ a{
+ width : 100%;
+ text-decoration: none;
+ &:hover{
+ }
+ img{
+ width: 100%;
+ height: 200px;
+ border-radius: 30px;
+ }
+ h1{
+ font-family: numeralBold;
+ margin-top: 15px;
+ color: #02A1A6;
+ letter-spacing: -1px;
+ text-align: center;
+ }
+ }
+ &__notAvailabe{
+ font-family: numeralBold;
+ width : 100%;
+ text-align: center;
+ color: #6f7074;
+ margin-top: 15px;
+ }
+ &__price{
+ width : 100%;
+ margin-top: 15px;
+ text-align: center;
+ &--old{
+ font-family: numeralBold;
+ color: #6f7074;
+ position: relative;
+ margin-left: 10px;
+ align-items:center;
+ span{
+ position: absolute;
+ left: 0px;
+ width : 100%;
+ height: 2px;
+ background-color: rgba(121, 121, 121, 0.534);
+ transform: rotate(-14deg);
+ }
+ }
+ &--price{
+ color: #4d4d4d;
+ font-family: numeralBold;
+ }
+ }
}
\ No newline at end of file
diff --git a/src/views/Products/Sort/index.js b/src/views/Products/Sort/index.js
new file mode 100644
index 0000000..9b16fdd
--- /dev/null
+++ b/src/views/Products/Sort/index.js
@@ -0,0 +1,36 @@
+import React from 'react';
+import SortIcon from '@material-ui/icons/Sort';
+
+import './index.scss';
+
+const maxDesktopSize = 1250;
+
+const fontSize = {
+ span : window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 90,
+ li: window.innerWidth > maxDesktopSize ? 13 : window.innerWidth / 95,
+}
+
+export default class Sort extends React.Component {
+ render() {
+ const {parent} = this.props;
+ return(
+
+
+
مرتب سازی بر اساس
+
+ {
+ parent.props.sortItems.map((item, i) => (
+
+ ))
+ }
+
+
+ );
+ }
+}
+
+const Item = (props) => {
+ return(
+ {props.data}
+ );
+}
\ No newline at end of file
diff --git a/src/views/Products/Sort/index.scss b/src/views/Products/Sort/index.scss
new file mode 100644
index 0000000..ef7e3a9
--- /dev/null
+++ b/src/views/Products/Sort/index.scss
@@ -0,0 +1,21 @@
+.products-sort{
+ padding: 5px 15px;
+ box-shadow: 0px 0px 10px #70707028;
+ border-radius: 8px;
+ span{
+ font-family: numeralLight;
+ color: #373737;
+ }
+ ul{
+ padding: 0px;
+ margin: 0px;
+ list-style: none;
+ flex: 1;
+ padding-right: 60px;
+ li{
+ font-family: numeralLight;
+ color: #373737;
+ cursor: pointer;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/Products/index.js b/src/views/Products/index.js
index 8c2e709..bb7a2cb 100644
--- a/src/views/Products/index.js
+++ b/src/views/Products/index.js
@@ -5,6 +5,10 @@ import Navbar from "../Home/Navbar/index";
import Footer from "../Home/Footer/index";
import Select from "./Select/index";
import Product from "./Product/index";
+import Breadcrumbs from "./BreadCrumb/index";
+import List from "./List/index";
+import Sort from "./Sort/index";
+import Filters from "./Filters/index";
import book1 from "../../assets/images/book1.png";
import book2 from "../../assets/images/book2.png";
@@ -16,6 +20,7 @@ import book5 from "../../assets/images/book5.png";
import "./index.scss";
export default class Products extends Component {
state = {
+ selectedFilters : [],
firstFilters: [
{ id: 0, value: "محبوب ترین" },
{ id: 1, value: "جدیدترین" },
@@ -44,6 +49,14 @@ export default class Products extends Component {
<>
>
@@ -74,11 +87,33 @@ export default class Products extends Component {
}
Products.defaultProps = {
+ sortItems : [
+ 'پربازدیدترین',
+ 'پرفروش ترین',
+ 'گرانترین',
+ 'ارزانترین',
+ 'جدیدترین',
+ 'بزودی',
+ ],
+ subjects: [
+ 'فیزیک',
+ 'زیست شناسی',
+ 'شیمی آلی',
+ 'روانشناسی',
+ 'علوم تجربی',
+ 'دین و زندگی',
+ ],
+ levels : [
+ 'اول',
+ 'دوم',
+ 'سوم',
+ 'چهارم',
+ ],
products: [
{
id: 0,
image: book1,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی",
price: "78.000",
oldPrice: "",
@@ -87,7 +122,7 @@ Products.defaultProps = {
{
id: 1,
image: book2,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی",
price: "39.000",
oldPrice: "59.000",
@@ -96,7 +131,7 @@ Products.defaultProps = {
{
id: 2,
image: book3,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی",
price: "21.000",
oldPrice: "",
@@ -104,7 +139,7 @@ Products.defaultProps = {
{
id: 3,
image: book4,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی",
price: "",
oldPrice: "",
@@ -112,7 +147,7 @@ Products.defaultProps = {
{
id: 4,
image: book5,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه هفتم ابتدایی",
price: "59.000",
oldPrice: "",
@@ -120,7 +155,7 @@ Products.defaultProps = {
{
id: 5,
image: book1,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی",
price: "78.000",
oldPrice: "",
@@ -129,7 +164,7 @@ Products.defaultProps = {
{
id: 6,
image: book2,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی",
price: "39.000",
oldPrice: "59.000",
@@ -138,7 +173,7 @@ Products.defaultProps = {
{
id: 7,
image: book3,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه ششم ابتدایی",
price: "21.000",
oldPrice: "",
@@ -147,7 +182,7 @@ Products.defaultProps = {
{
id: 8,
image: book4,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه دهم ابتدایی",
price: "",
oldPrice: "",
@@ -156,7 +191,7 @@ Products.defaultProps = {
{
id: 9,
image: book5,
- title: "منفجر کردن مغز خود را به ما بسپارید",
+ title: "کتاب علوم تجربی",
subTitle: "پایه هفتم ابتدایی",
price: "59.000",
oldPrice: "",
diff --git a/src/views/Products/index.scss b/src/views/Products/index.scss
index e4c3e28..bbf1b5e 100644
--- a/src/views/Products/index.scss
+++ b/src/views/Products/index.scss
@@ -5,6 +5,13 @@
padding : 0px 10px;
direction: rtl;
min-height: calc(100vh - 288px);
+ &__body{
+ margin-top: 20px;
+ &--left{
+ flex: 4;
+ padding-right: 20px;
+ }
+ }
}