update 5 files

master
Reza_ashrafi 2 years ago
parent 99647fb573
commit 552c12e29d
  1. 2
      src/components/Navbar/index.js
  2. 5
      src/views/Home/Landscape/Page1/Book/index.js
  3. 122
      src/views/Home/Portrait/Public/Header/index.js
  4. 13
      src/views/Home/Portrait/Public/index.js

@ -294,7 +294,7 @@ function Navbar({
{!user ? (
<Link
to="/signup"
className="bg-blueC0 font-semibold text-white rounded-md px-4 py-3 text-sm mr-7 hover:bg-opacity-90 shadow-sm"
className="hidden lg:flex bg-blueC0 font-semibold text-white rounded-md px-4 py-3 text-sm mr-7 hover:bg-opacity-90 shadow-sm"
>
{window.t("ورود یا ثبت نام")}
</Link>

@ -1,11 +1,10 @@
import React from "react";
import { Link } from "react-router-dom";
// import _ from 'lodash';
export default function Book({ book }) {
return (
<Link to={`{/products/${book.name}}`} className="flex group relative cursor-pointer">
<img src={book.imageUrl} alt={book.name} className="lg:w-auto" />
<Link to={`{/products/${book?.id}}`} className="flex group relative cursor-pointer px-4">
<img src={"https://dnvn.ir/api/v1/file/" + book?.fileIds} alt={book.name} className="lg:w-auto" />
<button className="py-1.5 px-5 border absolute border-white rounded-2xl group-hover:opacity-100 bottom-10 opacity-0 transition-all left-1/2 transform -translate-x-1/2 bg-blue90 bg-opacity-90 text-white text-sm">
مشاهده و خرید
</button>

@ -1,20 +1,19 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { Carousel } from "@trendyol-js/react-carousel";
//components
import Video from "../../../../../components/JolPlayer";
import Book from "../../../Landscape/Page1/Book";
import Lights from "../../../Landscape/Page1/Lights";
import Video from "../../../../../components/JolPlayer";
//assets
import arrow from "../../../../../assets/icons/dropdown-blue.svg";
import olum1Image from "../../../../../assets/images/olum-1.svg";
import olum2Image from "../../../../../assets/images/olum-2.svg";
import olum4Image from "../../../../../assets/images/olum-4.svg";
import olum7Image from "../../../../../assets/images/olum-7.svg";
import zist11Image from "../../../../../assets/images/zist-11.svg";
import sheffImage from "../../../../../assets/images/sheff.svg";
import flatFlower from "../../../../../assets/icons/flat-flower-white.svg";
import jojoImage from "../../../../../assets/images/jojo.svg";
function Header({ list }) {
function Header({ bookList }) {
const [show, setShow] = useState(2);
return (
@ -32,37 +31,41 @@ function Header({ list }) {
className="absolute transform left-1/2 top-0 -translate-x-1/2 opacity-30"
/>
<Lights degrees={[0, 0]} />
<div className="w-full flex flex-col lg:px-8 relative">
<div className="w-full relative z-10 px-4" style={{ direction: "ltr" }}>
<Carousel
show={show}
slide={1}
swiping={true}
swipeOn={0.05}
// useArrowKeys={true}
transition={0.5}
rightArrow={
<img
className="w-5 absolute top-1/2 transform -translate-y-1/2 cursor-pointer -rotate-90"
src={arrow}
alt=""
/>
}
leftArrow={
<img
className="w-5 absolute top-1/2 transform -translate-y-1/2 -translate-x-5 cursor-pointer rotate-90"
src={arrow}
alt=""
/>
}
>
{list.map((book, index) => (
<Book book={book} key={index} />
))}
</Carousel>
{bookList?.length ? (
<div className="w-full flex flex-col lg:px-8 relative">
<div className="w-full relative z-10 px-4 ltr">
<Carousel
show={show}
slide={1}
key={bookList?.length}
swiping={true}
swipeOn={0.05}
// useArrowKeys={true}
transition={0.5}
rightArrow={
<img
className="w-5 absolute top-1/2 transform -translate-y-1/2 cursor-pointer -rotate-90"
src={arrow}
alt=""
/>
}
leftArrow={
<img
className="w-5 absolute top-1/2 transform -translate-y-1/2 -translate-x-5 cursor-pointer rotate-90"
src={arrow}
alt=""
/>
}
>
{bookList?.map((book, index) => (
<Book book={book} key={index} />
))}
</Carousel>
</div>
<img src={sheffImage} alt="" className="w-full absolute bottom-0" />
</div>
<img src={sheffImage} alt="" className="w-full absolute bottom-0" />
</div>
) : null}
<div className="w-full flex justify-center mt-5">
<Link
to="/products"
@ -100,54 +103,15 @@ function Header({ list }) {
</div>
</div>
<div className="w-full p-4 transform translate-y-1/3 relative">
<img
{/* <img
src={jojoImage}
alt=""
className="w-full z-10 absolute top-0 left-0"
/>
<Video />
/> */}
{/* <Video /> */}
</div>
</div>
);
}
export default Header;
Header.defaultProps = {
list: [
{
name: window.t("زیست یازدهم"),
imageUrl: zist11Image,
},
{
name: window.t("علوم دوم"),
imageUrl: olum2Image,
},
{
name: window.t("علوم اول"),
imageUrl: olum1Image,
},
{
name: window.t("علوم هفتم"),
imageUrl: olum7Image,
},
{
name: window.t("علوم چهارم"),
imageUrl: olum4Image,
},
{
name: window.t("علوم چهارم"),
imageUrl: olum4Image,
},
{
name: window.t("علوم چهارم"),
imageUrl: olum4Image,
},
],
};

@ -1,4 +1,7 @@
import React from 'react';
import {connect} from 'react-redux';
//components
import Header from './Header';
import Features from './Features';
import Responsive from './Responsive';
@ -6,10 +9,10 @@ import Platforms from './Platforms';
import App from './App';
import GradiantText from './GradiantText';
function Public() {
function Public({bookList}) {
return (
<div className="w-full flex-1 px-4 pt-2 pb-24">
<Header />
<Header bookList={bookList} />
<Features />
<Responsive />
<Platforms />
@ -19,4 +22,8 @@ function Public() {
)
}
export default Public;
const mapStateToProps = (state) => ({
bookList: state.book.list
})
export default connect(mapStateToProps)(Public);

Loading…
Cancel
Save