From c5b34f527c3df186df8d75bc7cec515f2f05e29e Mon Sep 17 00:00:00 2001 From: MinhTuei Date: Sat, 25 Nov 2023 14:14:49 +0700 Subject: [PATCH] feat(confirm-order): add Confirm Order page --- src/App.tsx | 7 ++ src/assets/preview.png | Bin 0 -> 26716 bytes src/constants/menuBar.ts | 3 +- src/pages/ConfirmOrder.tsx | 215 +++++++++++++++++++++++++++++++++++++ src/pages/index.ts | 1 + tailwind.config.cjs | 1 + 6 files changed, 226 insertions(+), 1 deletion(-) create mode 100644 src/assets/preview.png create mode 100644 src/pages/ConfirmOrder.tsx diff --git a/src/App.tsx b/src/App.tsx index ab78a1b..c9129c1 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -6,6 +6,7 @@ import { MAIN_MENU, SUB_MENU } from '@constants'; import { useUserQuery } from '@hooks'; import { AppLayout, AuthLayout } from '@layouts'; import { AuthPage, HomePage } from '@pages'; +import { ConfirmOrder } from './pages/ConfirmOrder'; export default function App() { const navigate: NavigateFunction = useNavigate(); @@ -69,6 +70,12 @@ export default function App() { name: MAIN_MENU.location, element: <> }, + { + type: 'sub-item', + path: '/confirmOrder', + name: SUB_MENU.confirmOrder, + element: + }, { type: 'sub-item', path: '/help', diff --git a/src/assets/preview.png b/src/assets/preview.png new file mode 100644 index 0000000000000000000000000000000000000000..7242b78777e4819b8ea542cc26374c91c6ba7422 GIT binary patch literal 26716 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
AK=C{5s`uXk$?&iqarWDml zSdj_z+O1RC=MX3K>gDs>^btnz^DjJ4zxM~9mt)UzjQP^v`+0i%JKjyteD#}5U}Jju zl~?J32ksZ3B2InfzWasKDs}$Kc&QNHb@|Ppo3cd@B#%`$3xw3-nd3P zyL&7$w`jo@;P~X29(w3OmIx#9-ydWn1r;4HJo{~VMBED;b7>c@5(#qf#LvC(BAw?f z)jb#Y=+Or*NdWC zXkM#htleE@r`th)QS@jn`{Z!b3w8M zFM6A_bFMF0m|h_-exhfY+hEvjZg7md?pbM&`kUe}7bKIj0Hja-)GtVZ-{tdLe11a) zdBQR1fmBPDY{Y$qKJufVWWD(y9bSKhcG)d@<>i;O9;+a+j5paI+1uF=$#mh|t~}F| zpZWuwq4b(oMp}KC@vuoeDLKEx8Uof^ZvbMyx7;#Z4A6$EYV~-B==u^Rr}Xe!AEEEZIVUApJU{g%c`&$7MNfGP zbzN|~k%5A{@-P1I^HS6NzS7kj5;Pjao|zAp&-{fC$YOxIyv7;8zHzvqYn&>CyHF{ii8~+>8Ch-sv(-zha43CR zgd&iG^xLCCf+o;U5ZA~gA*-~IdMNd+$CZ~r~uy4O}{*ugQz!(Aa7gVL5~N5pS2&YmYQn%&Y5PVlpKfPWX>C#0Mj8ZblfeEOo?~!^__d(TUL`6r+JG;`%d`=`ri!i>wMbc0bb;XXWWfn-n000LY&4x$8$LrDY>Zf*LBpV2DZ;DSv-6 zhbtewvL#&2-b~0|5SZfI!qkZ!vKmPc^)GbG(pe z1~TvF{c1HFQ5XTOFA43fZ*EPGen%wXw~#!l_Uq zTgRBiX(=@UEGX007+ts6=z5Js&A~|};uT!6w~J!DQUD;eQ3xS2lECGtQ$CV_hc1(_ z!N}g-2x8zsPXS=Z(@N@}pqFrLUa3&o=P1_x$wEXhbm4>pAJ_K}IYGfW*kjEhBi0N~ z!{jYZI6$2+0xs;*rM*qM%(@yi&ii9^M}RbO=@}xIc7|d#qgZeM))BqTiH{u~AIf=- zW;XxX>d9aVfg>T2@LS`^g^FUbg>gyO*np0fDLaM64M513Ir|To^s)p2+M~So3VRnX zT_4j+Oq6q(bf>G$dOq0ajb$7hSBmap6F^Rl*&<7MMgO$A=vaHaV@gaEe{^Ytb!(!o65{R>QncWO)?{n40GYzIEnAO3QzJFsPWj9)2r>+>xhfThwnp6^H;?TMnJ2GP@+ zjeC6!z)z*KKOk+)z~|d4j3PT8@Sgc7TJ(m=nJYt zUer~fs-q|BBWJqo1<`53LYFbqEEEKPRHk^_*0p)b5UwiEW)m zgM2V`qFC8#v&Mf--Zs%hhGg;uJrL+{DuHv2SGu&3+aSBipV~3#M;;t}TX02XWv8)L zD_W;w_Qd*@szgM2U>!qe*~Dth-`TVxx0+O!frFu|V5q@061`+oJM|@*T7?LtT)#D8 zJv-H$vW@jJTc%iy^xjK5;+{dxAc6+u-DIN+*M95OF&)pa$-esoPsqU{gjP19EYcF)I+r%6SUa6B z#c$pomsXir3P*#>FwYixa=g?f2c^gjD;e4H5GdM1uc*je)M{h_S%_*~VhjD;c3<2q zO!26sK1ukp*#Y3;&YK1W>}>W z`u*Hy5Q(z1Xo;0i36it-YQz=`=S6pM&FqHERSL$vna^zHDCD2b3nYw>()=S2YhGh6 z_5cI8MD-F$!ous6z{SvSQm2!S|-L3RzCt*LAQJ`e%5vd=y-Eb?J53Sy!6;PUKlm>9RBKo`4^T&SaRu0!JG z8i#NvB8fCe1J$Cy3^Mz&SE$V>${rt1nfJWJQCvOp}HSbjTBZxYhYW`K1|Cji4kbPS+PfIm0nP4EvIN?*|GaJCc zwzg;rbO^khgFWiu$FmD_OHBgYpq|E5i;04xA(_Y)VTra7OKe0o#36JX{8*hJwvb%0 z7(;Lw3N4-&fSJ(-%N$~HwyayL3Sfi3jTo}byxZ(aQlqprrogFFSo2G@1Jv4$LNK?+ zmAos#bFIrdh!}Tj*Y!jwmAKCBHBGp-M>+>d>8GYV7T58PRh@)5N1TzVSh>EJkI6N^`Qgt$f7;fj?g`w*z6&{{c!fZM~ zEZXaR{1~XGu+`cN>nMo=i%WZBM7b7*lo^)Utu$Knt*cXd`gn^~bdZUz}tm_X-Y$j)PxZS2oo| z;WVpsT@4sC8pJ512711XiAaUutW(rY@AP$AyApxk5A9KHqH&W#*DOJ$ruo7mp=x#I zkUe|#P!|EWdJL`duvZo>txiiKb(Okkj-KqjNomX9*vk-B(@Z}_Gb!WV|Pu!}gdJ)74(I_ipMdg;NP}c_pRR$H2j@Z5t zwHjhU2-XvD?vHDPi~a41S|V2u=F-p9^t=?|F*2tnVWa@BQY*b^F-)yXHA6*U)(2Dr zRtJnqpn0H!+LpBYxvh*+D_z)emC}{I(j9Vt9H1aMY(*9H|)siwWkoTx^*)%h=4F46iCOI z5x+*w6>d}8v%|kfF(G_qSn7qa7oIsTLL;7q+3IE`nqc%4ETjo8f=`Pxz2G)XunEqHFqw$+ z<&A7z3?k*ip6O?KeL_&t2!JgtVg>_F*3YO^_iwX*3`Bsl2BiiwaGhAJsS?ZN$jMHmL{%;Mg&APM{M|v>AR5ntYK)!*H~d+^o!bNTyGzsCQ=57tDvY$K z0kikb`O{cIZF7Lt*hp^ZP?8uLJ)2mboI{mZQc_Bo(Sw)lkiA!+n{-I8(8;;B^Ia&# z)`f_5cC-jhGw2qq{?xOwPtTd+&nrKC)hu1z+}Eq6l(cYtC#73~q&(=@<_gL5=;&)V zDpklj7)CG}16G7DY~>noA_5iLh?t?EuMEkcaosjh`7NB>FDxTu(nz@5CV$rk{PA21 z1E7;3c%gbE5s!GdEpr4v9^Jydnbkh2oGiSlzPZ9c$8V)-X(2gDffhv)`{;IN>o=pS zCJ#F0o27YM9#KmNd&Yw@6WjtF(aJRxeO)AOVb@|q5(Jr= zP0`ybUS+mLP9a{hj=Ax8UduF2$!(LWA#tZDh!~Y32xOcpUSCfs>((#SCaH-m_ifV5tbKVEg2ApZsfO`bvLV4Op9PwU=A?^@ zZbfAt>~Jd@ZW78wX0ut*3n3X+wHp|wb9<%gnT27_m|N3qOSgzAEj{GO)`Ef1WT{B? zqW3db+d}TuGeb+<3ZrVBRai@g=G5FWj$lf$-`+OoQb$_Lg+e!5oWP78y&**VHbPQ1xL3}g{DzE`1!6oMr%3S~-5T_+LU zQFQIAIyrp-m~e0|o}CK(yD#B@4IC_sk(!uw3)-z|U939@ zl?edNY917g)>K`lBG>DvUG$1|PR&|S3k&UOjJR2ab!lQenxzeHcO5>qh!>D7%QIOZ z6_pdH`9kb>XnGhDK>b#o>WP_>@J-eFR~1oMR7++9ayzUgU8p%J>uk#EbC5b#b)j~F zt=S=jK}p#;ccEIcZ*L!;*BTrWPLE0)7+-oRw9>W4`=hppfrV^RzUAv=k%cQg1nt-l z*~F#PkeXx!CZC0)qoeYkyDpB=LaaoyR)te7Jm|$`&|T+7g@h1APt}c>1|>`CEvSx! z&P7CPSt~&-llWExMv!X+Qd)VC! z^ik@V*U75RI9Qz`cYPuyG1RxWk46JVFsl?6r@qEQ>z#rbRZ^DIQ>&INROk=kQo;4L zM0G4x2;B=9_eAH1l!5Wc790||I!IE$(!G9M%YHJ}nUD}x(8S65VB4ly%&`2|)Ml?rLOMR(G zRRS~Qx|xIC?*n*F-zZ+Xb?c3ydr_uuzj#JC@b$QHP)7{X&6m5G+mp*2ZQ2 z5E{RZmWWUt>y}|83v))}%0k=vf+tomA)MrKa55n*9B;B+is6t%pKHMzqFgsmYuZ0v zN}O2w zCOYU~+)5Ufw17a-Ai9o?@uie*NKR$1WV(*h0@_l<7D&Q?Cv(?HWG}PvP@Yy= zkr)@J*rYf=s6~&pLXdOD5(v{}U{}X{)Md0NQK0jzgYQ4z6A_OY4#$#YUy56V`-3PU zg+#wccL~YXvQo7H%{pExf=i=FiQLJGdP?lDOZGU+aeW%?`4uxhv!60dl@`o7zgbE= z09^m_Yu7iCwq;kzGqv44ZP8R)>ws^bY=DUNiB3vAjgK2>rOQkVQ9_K_A4Zvm=yXL) zMp`g&h-+pBsAcq6w;Ob|rQYh4H`b#%w4^%76Y-k4IpCP^^^;2StII08ySYpN-eji8 zlLg9Pm@#!A=G1&)-yl`NczLKY-=n{1g*uyw>mt9%(uJrb2=9CEyRgNFo5pb>d~d`o^U5>qp+Tq5=Sinp4TPrcD(*26>_|kj773^dXpdVU3Brku&LsQvR~q1aKQy^w4>MA1Vh5Bg zR_`K`K3wrYP;O!ZPH3vT{Ka{>H=&02RCUv9*Yk4f;p{a zqEs*3-Bg@~G)Kn=>wxN+p6-{%sU9P?c(P3Ytkjk28&SKC_E!V=ZSgTM#Xep7n^5&! z&yoi|FG#|WQKN6krzaK7yBxMey|k40Ec6w*(7zLNjTQ;`mWGUtSaovLK#m%SUaRFs z;v%~1mAz)jh}7NB{59_`WOe38pldg8iJP>yw^#eB@6_ht81q$j^4Mi)Ph-iyOQ1s* z1P{7guMFI3sLIeJ2y*^cgs4~x7FjBsF?@l_b5ZM z42Y<$-!#u`VliE(V{yQ{L_yKusT30U{nQp16gsof#ji^mb@_Cwqfa(7u^&Q8px6Qh z$v$x)g^>9+ZhzFVCCNNeC(_U;w)+Nf!)ohi%S~F>*o*FbLk2_E%ChK94lvO-W*IjY zWV6AjDGQ~=Ug06QU=!CGL&rmvmDMCIE$S7?ji=a}u@_Ch%2X1{(v${v%jPLC$&4Sv ziVz%;6$50^qNQehW>&`xF89I&ZxdtNFv|P)-<7Eb1D6n)+6I9d#n3Fw66{mrYRYWV z$|YYjo8*#A2_BwIHmk6KamK-| ze6XDiv9k_gUXx|nq~K1r0#re`umA_d=geFMoY9h&kT}Hjuv=%1+{md(xnfwVMPFpLfrM7Glw!2|dv!(vI)%)j zF~nGWK<=9X-CEg7J-K<>1cY*F(qV4drAZ5_k2EV_JR41kddry;ICo2w^ z5}wt;<|@bZEIpGTb9jVM&K|P6pjT>2 zP}UGJ%h_?@?wE>fO=ftFbjhbt&xO|+OowH#bYuf7wEwH8 zo*tomxf80?W~S`(KFwSZD|#CQg*7QqZhR(wo-St!|yx z5>vTOk&7XtUQM4_e%PqDHgSi~rN<=`#1xguPzhd09<4B-v1UEEFS?ezKVPn?L4#W5 zb<)F*8n04OZj8;e*@RDf6Dwtg6s_M9QnR+$ydoyq8D^WT+bqx_RDnt0#;Ly3x~u$H zD_lt?qA%`kO_y1y(jHs=y-c6DldovfF7r^GzMe;AZEbxtqNxE&$R9qq0c8YY99&wa zrf>DnZVRMLRaAZJz2U)1<93yhnm&x)r;P;*xwygSNE|JevHS4V{=p`X1LU2(F!m zmYakPelVPDG;qpt*4C*SS^vQ@IRfa~xX*N#>9sNxCZ0nQ^#wJC1va1G)X199AeB66 zuLFT@Rl_Dy;{}Hds122Ah_unQ9`Rb5^}MXTiZMw#`CesiQv*a7*IC;blRvy}Q>oE* z9lPowzk$pMv1AG6CUxK0U@O3zG;exrRdi6B^wRfixx6%t!k)!rri;u#@GOps(3mK( z7hJD24_+1_4EV{mK#?t_tl6dv@4)mI0>L=YJaY}=4r_X9%9L6F2q7^__d+k5br-37&t9H+ut9{- zp6!sv$MRp&1^(8~7EFS!SPp;*f};DmAyvz}wsJScU%jlAn343Y;TikbMNQ2{w343e zDGg}3SAxwWV$FSdK}k?|LynAfW2;u9r3?<{)}r{A%^v>l0lbQT`_vdR#63e zh_gxY^5x6X%4QRQVrMyyB8y^Kf6c%_9l40s8U8U*nOmT40k`v}IW@P%Qf(ZNM3aP;8C*PTLwp$FBbG_H(xA z&iiymu`UJmYzIYO!oij@Y%yb(gNrlnA+10i5YdR3pzvM&;Jjh;817UPMKgSIyE2c| z#1#5N=BCI*Hkl4}v8e$QC#2@S(Y`41+Ne-Ho#{|&h$M6#vfW|l;a30?ThG&6)+U^s zQ(fQRd27b!Dj`*sI;4e@L#yb{k`4)cKD*F6T^FhhdFia1-%Ke*ie&9>Pu=1Hhq=EA zOWJ25nB|r|v>9jA24W&V`?3xc$uEu>QH6Hn7U&yFN}@f#Pi{c9ZX%b|XNumK#OEq^ zHhyyZemPkLqT7n~rjJUe%XE36=7GCg>^@mS^XgWUyHDD>=m54IUR}L|ztCDYefQmERaM1}8#fB;Lzr=EYb&s&U5>|N!V&{`Gl(xWz{ll!ytxIR{9BG4930>~ zj>~5U9^tItXrCQ#sdwuy`h9RNYu~yb#&ho6xmXlMy}!SYYl}{M97_hiAGfi3-x2q* zK84n^@2MY#N6qkX7)1UpW8`D<-IG2HKjD>~ot^6V_*iDCVA&Du*?@u zxqqVdtk4=%_HqvA_QH0VP0he58A-*JD_4rESFeWc?QIZ9ae8`6jBw&lLGYzZmxu`h ztJV?-z>pvLH-J+za6PetbICTy2Zrl#y^KEd-*G%2J66U;1t|K?uf;t({o>l-W3u+B z9*u^O-2G5(6r;R)+{T{9hVcM-=mUN7wdp!HVr`tk?vvjuGOU~f>ywj{xVyVsgXpmL z`~8ad8ibb3OOoARt3#Q9@FEUDR#vXl+VVQve9PjVvUCh1S35-VOMZZAhBr-fJ3d}x=VNjlZ5aS*$94F`aoi7W@EiT&9PhZ-(tsxY z0buCQ$A~@av&I;FO!#eWMa|kh(ly=}cC^QJK1RFF`||7Zu`Y2h8z0(%2p7zy^6Y>a z@5{0*mq0FmRwh;I*I$3V#`-Av5{4aoIq~qZ8XS#&ib4aE{9y7M?ePLk`|Vq>e!N}F>Oo(S6rglmi#Mbe zT8q=_2V+EA@89kfvT+jkA$-<|RJn4-0l=d*SKH@?4o;y%`Q{w%eR z3CLtvR(O3MR0YnlRIGR>mW;wwE}DPs*M2Sh)^Gims11KtLkOX3oVEPmwH6prvK>(5 zRoF~_d1nAzCcIA==P?NWEl&t!qn}&1Zprm5!lfhTbcEON1~r1tLmPbeV{5hq2(R)B%!+l31k0z?t55p`~ibvE=7?YO(2gtoY!Q~n#>*4!iS|Ez7Dhv?7J zb+KFb=(G_IWkyJC!4UjA*RS23*8I+o1!^N(euvNr-8g%vR*fS|nKj)-aQcpF0~iB9 zG!8OHlj)F_W!@Peb$}!1LCH=e{5=s214GVd0Lgv!R^Mowx3fM&4p8embjFj~;5>+k zMP!Xn>}TA&_1mw5MDzQ0+DRL1#;p#kx&xmUlD+61wo&H)#w>(DzZc!=KpX2iWxQ`LWLN(YkinnSe&?u3y*otn+8J?~dV& z{zkXESNB=hJX`l!^4;M!v>kBmJDeG@CH4##kgQ_w;Io6va3|#Y7Q7?tM38JZ0+M@% zWJk0h+YmkUL3bV|Kjwt6;lz;eb0SiH^{OJ{hU)ux{)K<_8iFraI_=5vu|{d zS=-z0Xmh7_-X?F?y(S~R{QO3KUHxZIXe^Otv!3FLH2O@=elF^$vUXjSN9&>^S5i8Uvt)VejL}{uJ7C3 z+mGjcWpGM}%_OA5S76@d+zdBFMC+CB83?8|owN{~iS2}BA6PEJX_d=`2&kdbb)Rc@ z2Sx`d>-tT{y8yJ`T_S8}M=cEqTQU|fwP8|+zsoEcS>rlx$k$o1zTfZ~PTzQ}_)n))K{d;Z)tm&)h z068~Gx@slYZR?Dfm2u#BK87`Yt$UWTYb4!f9P9R+YaJb}?{p``b&RYP-}sE@yq5qI^PWU(2SDs~^PR(K4xo)M+ZMStIpmV(2(V53Hv2m6NS^Is>L#+EA&iKA^ zF1H)*K=J9?&Nbb8pLN}t_sCUXT#YfTvu#>%yTf){}zziwOC=gP4+aN}0nH*)-T zz`p}v=-<}%MhWva$LVi#pLOSNhxi|4>k`=;IsUH!8#%h}h4h3(00000NkvXXu0mjf Dm1r08 literal 0 HcmV?d00001 diff --git a/src/constants/menuBar.ts b/src/constants/menuBar.ts index 6d2e90e..a804f1e 100644 --- a/src/constants/menuBar.ts +++ b/src/constants/menuBar.ts @@ -7,5 +7,6 @@ export const MAIN_MENU = { export const SUB_MENU = { help: 'Help Center', settings: 'Settings', - logout: 'Log out' + logout: 'Log out', + confirmOrder: 'Confirm oder' }; diff --git a/src/pages/ConfirmOrder.tsx b/src/pages/ConfirmOrder.tsx new file mode 100644 index 0000000..a6508c8 --- /dev/null +++ b/src/pages/ConfirmOrder.tsx @@ -0,0 +1,215 @@ +import CoinIcon from '@assets/coin.png'; +import { + ClipboardDocumentListIcon, + MapPinIcon, + PrinterIcon, + WalletIcon +} from '@heroicons/react/24/outline'; +import { + ChevronRightIcon, + ExclamationCircleIcon, + QuestionMarkCircleIcon +} from '@heroicons/react/24/solid'; +import { Button } from '@material-tailwind/react'; +import previewImage from '@assets/preview.png'; +export function ConfirmOrder() { + const PICK_UP_LOCATION = 'Tiệm in thư viện H3, tầng 1'; + const User_Balance = 200; + const Orders = [ + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + }, + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + }, + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + }, + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + }, + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + }, + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + }, + { + preview: { previewImage }, + name: 'filename.csv', + size: '20 MB', + amount: 2, + fileCost: 200 + } + ]; + const PRINT_FEE = Orders.reduce((total, order) => total + order.fileCost * order.amount, 0); + const FEE = [ + { name: 'Print fee', price: PRINT_FEE }, + { name: 'Service fee', price: 2 } + ]; + const BUTTON_CLASSNAME = + 'h-[64px] px-8 py-2 text-xl font-bold text-white rounded-none hover:shadow-none shadow-none rounded-b-lg'; + return ( +
+
+
+ + Document +
+
+
+
TÀI LIỆU ĐẶT IN
+
SỐ LƯỢNG
+
THÀNH TIỀN
+
+ {Orders.map((order) => ( +
+
+ Preview +
+
+ {order.name} + ({order.size}) +
+
+ Coin Icon + {order.fileCost} +
+
+
+
+ + x{order.amount} + +
+
+
+ Coin Icon + + {order.fileCost * order.amount} + +
+
+
+ ))} +
+
+
+
+
+
+ + Pick-up location +
+
+ {PICK_UP_LOCATION} + +
+
+
+
+ + Payment method +
+
+
+
+ Print wallet + +
+
+ Current balance: + Coin Icon + {User_Balance} +
+
= FEE.reduce((total, item) => total + item.price, 0) + ? 'hidden' + : 'flex flex-col mt-3 bg-red-100 rounded-sm p-3' + } + > +
+ + Amount exceed balance! +
+
+ Top up your account to proceed. +
+
+
+
+
+
+
+ + Charge Details +
+
+ {FEE.map((item) => ( +
+ {item.name} +
+ Coin Icon + {item.price} +
+
+ ))} +
+ Total cost +
+ Coin Icon + + {FEE.reduce((total, item) => total + item.price, 0)} + +
+
+
+ +
+
+
+
+ ); +} diff --git a/src/pages/index.ts b/src/pages/index.ts index 1f1920f..a0a1310 100644 --- a/src/pages/index.ts +++ b/src/pages/index.ts @@ -3,4 +3,5 @@ */ export * from './AuthPage'; +export * from './ConfirmOrder'; export * from './HomePage'; diff --git a/tailwind.config.cjs b/tailwind.config.cjs index d88741b..6f2dac0 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -23,6 +23,7 @@ module.exports = withMT({ 'blue/1': '#1488D8', 'blue/2': '#030391', 'gray/1': '#F5F5F5', + 'gray/2': '#DDE2E5', 'gray/3': '#ACB5BD', 'gray/4': '#495057', 'yellow/1': '#D97706'