icon uploded

tree icon add to footer
demo
taha12322 3 years ago
parent dc75dd168a
commit d5922b785e
  1. BIN
      src/components/image/noneScroll.png
  2. BIN
      src/components/image/scroll.png
  3. 26
      src/containers/Footer.tsx
  4. 4
      src/containers/menu/Option.tsx

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -7,6 +7,7 @@ import styled from "styled-components";
import ProgressBar from "../components/footer/progressBar";
import onePage from "../components/image/Document.svg";
import twoPage from "../components/image/Pages.svg";
import { BookCloseIcon, BookOpenIcon, ScrollVerticalIcon } from "lib/svg";
const Footer = ({
// title,
@ -35,14 +36,14 @@ const Footer = ({
<Item text={`${nowPage} / ${totalPage}`} />
</nav>
<ProgressBar CountPage={CountPage} />
<nav
// style={{pointer='cruser'}}
onClick={() => changeIcone()}
className="nav-icon "
>
<nav onClick={() => changeIcone()} className="nav-icon ">
{window.innerWidth > 768 ? (
<div className="display-icon" style={{ cursor: "pointer" }}>
{Icon ? <img src={onePage} alt='singlepage' /> : <img src={twoPage} alt='twopages' />}
<div className="display-icon" style={{ cursor: "pointer" }}>
<nav style={{ width: "65px" , display: 'flex' }}>
<BookOpenIcon />
<BookCloseIcon />
<ScrollVerticalIcon />
</nav>
</div>
) : null}
</nav>
@ -53,6 +54,17 @@ const Footer = ({
);
};
const Icon = styled.div`
width: 16px;
height: 16px;
& > div,
& > svg {
width: 16px;
height: 16px;
}
`;
const Button = styled.button`
width: 100%;
justify-content: center;

@ -200,7 +200,7 @@ const Option = (
step={0.1}
onChange={(e) => onChangeSlider("LineHeight", e)}
/>
<OptionTitle>رنگ ها</OptionTitle>
{/* <OptionTitle>رنگ ها</OptionTitle>
<BtnWrapper>
<Btn>الف</Btn>
<Btn>الف</Btn>
@ -212,7 +212,7 @@ const Option = (
<Btn>الف</Btn>
<Btn>الف</Btn>
<Btn>الف</Btn>
</BtnWrapper>
</BtnWrapper> */}
{/* <OptionSlider
active={true}
title="Horizontal margin"

Loading…
Cancel
Save