From d5922b785e0a64e4a9c3b31e99090e6e142cee26 Mon Sep 17 00:00:00 2001
From: taha12322 <66300435+taha12322@users.noreply.github.com>
Date: Tue, 17 Aug 2021 16:56:20 +0430
Subject: [PATCH] icon uploded tree icon add to footer

---
 src/components/image/noneScroll.png | Bin 0 -> 1329 bytes
 src/components/image/scroll.png     | Bin 0 -> 1356 bytes
 src/containers/Footer.tsx           |  26 +++++++++++++++++++-------
 src/containers/menu/Option.tsx      |   4 ++--
 4 files changed, 21 insertions(+), 9 deletions(-)
 create mode 100644 src/components/image/noneScroll.png
 create mode 100644 src/components/image/scroll.png

diff --git a/src/components/image/noneScroll.png b/src/components/image/noneScroll.png
new file mode 100644
index 0000000000000000000000000000000000000000..6d265d576c342d4837ec0d155217c1ecb3ad8088
GIT binary patch
literal 1329
zcmeAS@N?(olHy`uVBq!ia0vp^3Lq@N1|*eVE!z&HSkfJR9T^xl_H+M9WCckkdj$D1
zFjT2AFf_C<F#G}vHN0S8C^cYUc$L7wU^Rn*LA+qju0R{01Y44~y9<y8f}hU2>wy$!
zfk$L9kWK*O57|!VfeiK%PhVH|ryPRZCYsA#?_U5~s^ID37?N@C?eu(~&{Ub@_U9iS
zn#RX1xmj}?tJ5<56yGylTTZJ*U+a#kc<&nQ{Z#45v!<-myyy1rC^^+)=DD*$$?9R8
z#H^=9iOw$3Dmhy3FWs5Ll(p<i65pii`Ee(9exH!>{m!gyrFQGjoqPY?=KS~H*3W;k
ztHA(&()%;b?2{)gc-Hp4GkE!eZ>?%O^W{A>mkRVp%dQBT+QnqLzT&jBl#`X|U4Hk<
zf)kHF?wc})XK{1j`LYrQ_Z8<)FlZi$ULAgT-lA#KcI-HwD=#Fr<ZNFzbDQPftWb~T
z%c4IEmNBjpH#xR!NrQyIexN4Nn3<NwBGYX@b#F3?h|k=7cVBKy!Cm&VXM>kJ<>o)W
zFiG{n#~(#&!fw>p{{MP%a_{%>8++dzkKXRItEuPZwVI55#}@x?&93{rZ~m;R_dEB>
ze)#yRM{?JlN|)(V8$Y`qzr9LopF`-p31Zwn^7{(&PKyb2zr49aFv35_r$^6la^pfp
zg+}jHT<6qf=ZA+#=zE;yzZbS$+T#4(OF^**&aM3SZ{tFv_h0KDHZ|;>Z}MA6C}E4W
z!RtGg2aX+mdAZbdm8jix?xNjq+wZ>PVEMUs|C>9UZyw%0<iyO|{Ujq$(4xKQ-pVy5
zc6qtG@@KAUIy1Fwy0>_ST51A=&dXE&nVDQa_J6#6>hyc_bCGT#rbUkr?!10_N)uD;
zgB=l<Z*$jpp1!oyVeSuQYiW;1Kc;H$+7lD_u*}`gv}xDz8WzdVmR7#&?(d6b+!;A@
z`c%;_Zt+b^S?BDQ%|3Qkvst54CTa`Ei)RxSMQ6KAv)E9kYte5N)i2BZT=Ms;YheQJ
zPfi~_x{Gh#^T#(LBxZ`)>e|{C$<E?G8$Mz2CS`5!&K>vnt6n%hWyOl$_q!(@IBQ+5
zma!q?<@^_WV-`M%*7+aPUlWzHul{zJ!xWZt+qb?HitTuMdZF6=+Xi`ph8;^=F2}|S
zi=+wVzq!SF^}U(-`I*dDOMTy;ozHI+ua<jznfI9k#zssRdkuG2S1DZ={Ibz;T3Y&R
zru?q!w{FQDRC=-VnfJFU#~M}pt+#ni<{Wj8-ri(<xv=!I+T+J<+d1r-as#4|wAJ_h
z+_jGHMbf0hhK`RS-Tu@a=-Rr9Yo60fEj_l`XVX6aJ}iI!gV~SpEzHfIszQ>gtqq)4
zb#^Y?0gQ$1(w|)VB*JfQU^SDQX)S(4EA{T7RtKj0clUBHUY?qjuKuK3rts&ck9D@2
zJa@%>|97KMentF_-@g<J&fK3qlT-TKnje23x$6FyuzAn6-p-`5ITnsDTwW~n^pc2u
zzWwNNXUBu5rZzVpWBnf;vQ)lK&rU9hNqKYrJ(f==1er7*&0HPs_-?_Ctkyj?$G=b4
zb2V`IV6^32_1ewCS$3a~Uc3IkT+ewH-`h!Hv!DI_@Z@BHzB4R){*V60VtxOr;z^B#
zvcTd)wZt`|BqgyV)hf9t6-Y4{85kMr8d&HWnuiz~TA3PInHXvt7+4t?)cfQ*qiD#@
aPsvQH#I1o(@alh{1_n=8KbLh*2~7Zmn_L9|

literal 0
HcmV?d00001

diff --git a/src/components/image/scroll.png b/src/components/image/scroll.png
new file mode 100644
index 0000000000000000000000000000000000000000..5c4978bc12baf5e166cddf2b0e24039c570c6aaa
GIT binary patch
literal 1356
zcmV-S1+)5zP)<h;3K|Lk000e1NJLTq001BW001Bm1^@s6BkHEN00004XF*Lt006O%
z3;baP0000WV@Og>004R>004l5008;`004mK004C`008P>0026e000+ooVrmw00006
zVoOIv00000008+zyMF)x010qNS#tmY0AK(B0AK*{YeLTe000McNliru<p>cAG$7uY
zXLJAn1UpGYK~!ko?U{c_ly@A*U*G4PwZbhkx7sO|WIu%1(#&8#NI^!>Hnw%1Rv3tS
zg*3Q^**5Y{7psOdb+fKhJauW_(Fzvq4`XL3V{B3*gk+h~TACOeY?9El=h+|Kb9c=%
zgPx~y-0Pp`xqH6f&-eZQJm2rbm(N%5*l7I7<BpAmi7xqiWhL;j_&O^q@LcSbFLrc*
z;Z1|5qy+N!XPa-`(p#0#-?;Oy_TpvB?%jL6fScEi#s_pT(>*wN?=~|Nik{D@yL?$M
zb&`I@9c$a7l9C=^+#xDXoCvzA1hw;e?~gMh63{Tzx*{O~q;BbSM@I<bzi`K9gQ5%O
zOD0p`$_L_5Y3bxdNE-}sUN1CQJ?^DTwN|U)5>SoHF$Txkvp_S$ix&qCRWICjI~4Yq
zPnDNX9p|WWT(R5lwYS-V9t?`|8#h3CNtw5PJy<L`KMo8$s%i~qfNU`QcI?<><Gjo>
z6&2GPSFwm(VYdhR`7tWCxHyoG@M>eDcDgmAKIOR5)CA7d_IG4C@FpJ>HI5qBS?!K;
zxt_G!5GabG2muXNk7xdT?c;xyc4~P{OkkWaVZvy@6Ie?}9Uk|pRe+E;rl*65R_07h
zK*Wb~TUQt4|Gs6*)vN!b1hfpd49}elcTyrdT`o}U2$Ly9!!+KLWneG4b#*X!`o$Bw
zc0sww5EB!6snc;QtTL@}l^#w?67V*rojbv}d1S}FeR`|YF#+mSpJd!jcV{O^W&Dwx
z3_?iKnl(T=HNCw-?FN)os}&9(Zf%W@o`DGv5z2~n>p~2<oaEwSC>YKu?(2iX!tCtx
z=Rx#~4SV(kH7p=1G7=)XBf3*lXJP^tDKCUtyUM3h?3_6vI-HY@A^)EzGRMbtQ>kA9
z8sl4A6BA+LTZ5^;pTHXTO?Cep_Ze4QVr5koP{sB5c%YBZM@M0H=|A5sS_F9u^A_H|
zJ%bXU;@sH&er+xOkK02_>lL3^tx))-d7!#lFLeg}6Oi(2@uf3o;JGix>SoOXz9(kw
zS|Ej4hT!piZyfluv=oZ==bWpl(OcaU*a)d#b^piBx5kxMo;}dh0~X6$7skdOzpgN0
z!aN!_#imFS9Cfr6E?A&_d^N5*jy7nx5i-8EveM-OQ7?^*jA&mHQ{%>^u0Xq*pq4wq
zlawVU0v2+G2vl{QKed1JFvZaSqW1GwhkbF8MahySPhkS2yLS_|ZUwfn@Y=PY2NxMH
zD}(wp_q+F%xu?KCbA0{$_{!q)4t~hb*Gjbx`+(`r2mA*kM{>3Wm%W{{-RZk`1GS3v
z;K9kprN4zeBLfN!Wt*>Dd5RODq8@2UXQaH&PNqH@Q`xSRZQ2y{+jmANXUQ!Y8L<85
z&7=MOTB{5nj_RKP)j-4n>5bK^K{yn1b2DHRpWVC(ct{!=0>(sPQ&XUwzQ$Gl1wQJ*
z!_chR6#xJLC3HntbYx+4WjbSWWnpw>05UK#F)c7SEipG#F)=zdGCDIdD=;uRFfc@6
ze#Za+03~!qSaf7zbY(hiZ)9m^c>ppnGBGVMI4v<ZR539+H8MIgGAl4JIxsLbJjQzf
O0000<MNUMnLSTXk(_f?j

literal 0
HcmV?d00001

diff --git a/src/containers/Footer.tsx b/src/containers/Footer.tsx
index 8d32881..0523ce4 100644
--- a/src/containers/Footer.tsx
+++ b/src/containers/Footer.tsx
@@ -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;
diff --git a/src/containers/menu/Option.tsx b/src/containers/menu/Option.tsx
index 9dadf31..cb85aa7 100644
--- a/src/containers/menu/Option.tsx
+++ b/src/containers/menu/Option.tsx
@@ -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"