|
|
|
@ -2,6 +2,18 @@ import React, { Component } from 'react'; |
|
|
|
|
import {Link} from 'react-router-dom'; |
|
|
|
|
|
|
|
|
|
import './index.scss'; |
|
|
|
|
|
|
|
|
|
const maxDesktopSize = 1250; |
|
|
|
|
|
|
|
|
|
const fontSize = { |
|
|
|
|
desktop: { |
|
|
|
|
h1: window.innerWidth > maxDesktopSize ? 22 : window.innerWidth / 65, |
|
|
|
|
h2: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 85, |
|
|
|
|
notAvailable: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 70, |
|
|
|
|
available: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 70, |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
export default class Simple extends Component { |
|
|
|
|
render() { |
|
|
|
|
const { height, data } = this.props; |
|
|
|
@ -12,24 +24,24 @@ export default class Simple extends Component { |
|
|
|
|
}}> |
|
|
|
|
<Link to={`/books/${data.id}`}> |
|
|
|
|
<img src={data.image} alt={data.title} /> |
|
|
|
|
<h1>{data.title}</h1> |
|
|
|
|
<h2>{data.subTitle}</h2> |
|
|
|
|
<h1 style={{fontSize : fontSize.desktop.h1 }}>{data.title}</h1> |
|
|
|
|
<h2 style={{fontSize: fontSize.desktop.h2 }}>{data.subTitle}</h2> |
|
|
|
|
{ |
|
|
|
|
data.price ?
|
|
|
|
|
<div className="slider-simple__price d-flex justify-content-center"> |
|
|
|
|
{ |
|
|
|
|
data.oldPrice ?
|
|
|
|
|
<div> |
|
|
|
|
<div className="slider-simple__price--old d-flex"> |
|
|
|
|
<div style={{fontSize: fontSize.desktop.available }} className="slider-simple__price--old d-flex"> |
|
|
|
|
{data.oldPrice} تومان
|
|
|
|
|
<span></span> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</div> : null |
|
|
|
|
} |
|
|
|
|
<div className="slider-simple__price--price">{data.price} تومان</div> |
|
|
|
|
<div style={{fontSize: fontSize.desktop.available }} className="slider-simple__price--price">{data.price} تومان</div> |
|
|
|
|
</div> : |
|
|
|
|
<div className="slider-simple__notAvailabe">ناموجود</div> |
|
|
|
|
<div style={{fontSize: fontSize.desktop.notAvailable }} className="slider-simple__notAvailabe">ناموجود</div> |
|
|
|
|
} |
|
|
|
|
</Link> |
|
|
|
|
</article> |
|
|
|
|