You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

81 lines
2.2 KiB

// components
import styled from "styled-components";
import Wrapper from "components/header/Wrapper";
import Layout, { AutoLayout } from "components/header/Layout";
import Logo from "components/header/Logo";
import Item from "components/footer/Item";
const Header = ({
onNavToggle,
onOptionToggle,
onLearningToggle,
title,
}: Props) => {
return (
<Wrapper>
<Layout>
<AutoLayout style={{ backgroundColor: "#009AA8" }}>
<nav style={{ display: "flex", marginLeft: "16px" }}>
<Img
src="/react-epub-viewer/images/Setting.svg"
onClick={onOptionToggle as any}
alt="Logo"
/>
<Img
src="/react-epub-viewer/images/Edit.svg"
alt="Logo"
onClick={onLearningToggle as any}
/>
</nav>
<nav>
<Button>خرید کتاب</Button>
</nav>
<nav
style={{
display: "flex",
marginRight: "16px",
alignItems: "center",
}}
>
<Item text={title as any} />
<span style={{ color: "#fff", marginRight: "10px" }}>||</span>
<p style={{ margin: "0", color: "#fff" }}>نام کتاب </p>
<Logo />
<Img
src="/react-epub-viewer/images/menu.svg"
onClick={onNavToggle as any}
alt="Logo"
/>
</nav>
{/* <ControlBtn massege="فهرست" onClick={onNavToggle} /> */}
{/* <ControlBtn massege="تنظیمات" onClick={onOptionToggle} />
<ControlBtn massege="نشانه گذاری" onClick={onLearningToggle} /> */}
</AutoLayout>
</Layout>
</Wrapper>
);
};
const Button = styled.button`
display: flex;
margin-top: 11px;
border-radius: 5px;
border: solid 2px #fff;
padding: 3px 2rem;
color: #fff;
font-family: inherit;
`;
const Img = styled.img`
width: 25px;
`;
interface Props {
title: String;
onNavToggle: (value?: boolean) => void;
onOptionToggle: (value?: boolean) => void;
onLearningToggle: (value?: boolean) => void;
// setsettingicon: (value?: boolean) => void;
}
export default Header;