From bded278ce36692ef6d8a1125e65ca6b2655e4aa2 Mon Sep 17 00:00:00 2001 From: Luiz Felipe Silva Date: Sun, 15 Jan 2023 01:41:23 -0300 Subject: [PATCH] =?UTF-8?q?feat:=20cria=C3=A7=C3=A3o=20e=20estiliza=C3=A7?= =?UTF-8?q?=C3=A3o=20do=20footer=20finalizado.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/img/boleto.png | Bin 0 -> 821 bytes src/assets/img/diners.png | Bin 0 -> 1279 bytes src/assets/img/elo.png | Bin 0 -> 880 bytes src/assets/img/hiper.png | Bin 0 -> 748 bytes src/assets/img/master.png | Bin 0 -> 735 bytes src/assets/img/pagseguro.png | Bin 0 -> 886 bytes src/assets/img/visa.png | Bin 0 -> 1000 bytes src/assets/img/vtex.png | Bin 0 -> 1637 bytes src/assets/svg/{arrow.svg => arrowRight.svg} | 0 src/assets/svg/arrowTop.svg | 3 + src/assets/svg/facebook.svg | 16 +++ src/assets/svg/instagram.svg | 18 ++++ src/assets/svg/linkedin.svg | 18 ++++ src/assets/svg/m3.svg | 4 + src/assets/svg/twitter.svg | 11 ++ src/assets/svg/vtex.svg | 7 ++ src/assets/svg/whatsapp.svg | 11 ++ src/assets/svg/youtube.svg | 11 ++ .../Header}/Form.module.scss | 0 src/components/Header/Form.tsx | 2 +- .../Header}/HeaderWrapper.module.scss | 0 src/components/Header/LogoM3.tsx | 6 +- .../Header}/Menu.module.scss | 3 +- src/components/Header/Menu.tsx | 6 +- .../Header}/Nav.module.scss | 5 + src/components/Header/Nav.tsx | 8 +- src/components/Header/User.module.scss | 30 ++++++ src/components/Header/User.tsx | 10 +- .../footer/FooterBottom.module.scss | 98 ++++++++++++++++++ src/components/footer/FooterBottom.tsx | 81 +++++++++++++++ src/components/footer/FooterTop.module.scss | 78 ++++++++++++++ src/components/footer/FooterTop.tsx | 86 +++++++++++++++ src/components/footer/Newsletter.module.scss | 78 ++++++++++++++ src/components/footer/Newsletter.tsx | 22 ++++ .../global/ButtonsGlobal.module.scss | 18 ++++ src/components/global/ButtonsGlobal.tsx | 33 ++++++ .../section}/Breadcrumb.module.scss | 2 +- .../{institucional => section}/Breadcrumb.tsx | 6 +- .../section}/InstitucionalContent.module.scss | 2 +- .../InstitucionalContent.tsx | 4 +- .../section}/NavInstitucional.module.scss | 2 +- .../NavInstitucional.tsx | 4 +- .../section}/SectionAccordion.module.scss | 2 +- .../section}/TitleInstitucional.module.scss | 0 .../TitleInstitucional.tsx | 2 +- src/pages/Footer.tsx | 19 ++++ src/pages/Header.tsx | 2 +- src/pages/Home.tsx | 11 +- src/pages/Institucional.tsx | 29 ------ src/pages/Section.tsx | 27 +++++ src/styles/partials/header/User.module.scss | 22 ---- 51 files changed, 717 insertions(+), 80 deletions(-) create mode 100644 src/assets/img/boleto.png create mode 100644 src/assets/img/diners.png create mode 100644 src/assets/img/elo.png create mode 100644 src/assets/img/hiper.png create mode 100644 src/assets/img/master.png create mode 100644 src/assets/img/pagseguro.png create mode 100644 src/assets/img/visa.png create mode 100644 src/assets/img/vtex.png rename src/assets/svg/{arrow.svg => arrowRight.svg} (100%) create mode 100644 src/assets/svg/arrowTop.svg create mode 100644 src/assets/svg/facebook.svg create mode 100644 src/assets/svg/instagram.svg create mode 100644 src/assets/svg/linkedin.svg create mode 100644 src/assets/svg/m3.svg create mode 100644 src/assets/svg/twitter.svg create mode 100644 src/assets/svg/vtex.svg create mode 100644 src/assets/svg/whatsapp.svg create mode 100644 src/assets/svg/youtube.svg rename src/{styles/partials/header => components/Header}/Form.module.scss (100%) rename src/{styles/partials/header => components/Header}/HeaderWrapper.module.scss (100%) rename src/{styles/partials/header => components/Header}/Menu.module.scss (72%) rename src/{styles/partials/header => components/Header}/Nav.module.scss (83%) create mode 100644 src/components/Header/User.module.scss create mode 100644 src/components/footer/FooterBottom.module.scss create mode 100644 src/components/footer/FooterBottom.tsx create mode 100644 src/components/footer/FooterTop.module.scss create mode 100644 src/components/footer/FooterTop.tsx create mode 100644 src/components/footer/Newsletter.module.scss create mode 100644 src/components/footer/Newsletter.tsx create mode 100644 src/components/global/ButtonsGlobal.module.scss create mode 100644 src/components/global/ButtonsGlobal.tsx rename src/{styles/partials/institucional => components/section}/Breadcrumb.module.scss (95%) rename src/components/{institucional => section}/Breadcrumb.tsx (61%) rename src/{styles/partials/institucional => components/section}/InstitucionalContent.module.scss (94%) rename src/components/{institucional => section}/InstitucionalContent.tsx (90%) rename src/{styles/partials/institucional => components/section}/NavInstitucional.module.scss (96%) rename src/components/{institucional => section}/NavInstitucional.tsx (81%) rename src/{styles/partials/institucional => components/section}/SectionAccordion.module.scss (84%) rename src/{styles/partials/institucional => components/section}/TitleInstitucional.module.scss (100%) rename src/components/{institucional => section}/TitleInstitucional.tsx (66%) create mode 100644 src/pages/Footer.tsx delete mode 100644 src/pages/Institucional.tsx create mode 100644 src/pages/Section.tsx delete mode 100644 src/styles/partials/header/User.module.scss diff --git a/src/assets/img/boleto.png b/src/assets/img/boleto.png new file mode 100644 index 0000000000000000000000000000000000000000..aa3078ef25495aa466bf2d9552b59a51e7302af4 GIT binary patch literal 821 zcmV-51Iqk~P)q?E1bxUWD?t_(as9<*8w zBw`BukPzg`@-Q@{f+M_Ek(~{f%Y~QS&vEfmHKwMt2nyN=36%i##5im=8^%UQ zKqW|FGR`4NC`9jv9^~)dgM$4Bn2FNqbO;U!#bCb@(J?XLa((c5cnBW1hX@g3d1VFP zO(yX9d<+gK5fK>)x7&@L_wOJtufVKf7NKEwh~nb#ZDt0GiwhVX{Q@43he?fwp5Ncs zi^QblwZel77P2miDeIz`^1q4l;9ud(WKfyB9EN=bh!=}V&Emr0a3E)w41s}xxT9z% z1vL~7yB)H;d~6blAeK=43CI}ep(ORqz1(&N|}UX zCd%uM^YinF7DnSm_cK(SJ%{kHFg$(oh&=jboerl1ON&c5QdErokA1jsxf)fKXVBKs zNn6&}u@Oe$7_X_ih9;QJKj@S#ESNDtJS{3puxdiBudnL!57+>s(FpbUIQYSQ zCZXU{Q&V$@oKt`AoYw0hAf{=xT9B5W0kK$ut_ST%O-sk|(lU~=F3cGWke{v~o;HFv zuU`?b3&*fZMf;z3j`#gZwLKI}NLJ5?XmQHDDJJZg7H@~^Xkp#5-lD?BO_nvdlx#zv#_rBkO zF$TqPoTYO8M%sApEZU?kR^{(S?mU?S>ZPqH5Kz@=+Pm*?TU9W6KvP;9Q??yEh}fXh35iZK237=mpbO$(j!7bc#$iO?B8qS0e9D zpH$|fGoE8*W0aQ`-gRq2ok^R7;jnSG&b!AgLOu^0W=DAEP@JKh#d{Bz(cEb;y~2Z6 z;%ZtByG|#0eNlv~Ns}_a&PPY$ERYZA8MatH&Cj9s4D)7Ikj-XUy}gAa8=KhI($ChT zJ#1Osz@fIpO%W=lZ1d?nYo@AfX|Z@^hDz9{a%NEB@#%i*qdtyb$x!N5i1-xR;|48# z1{uSqd)Q{@sWcJ{Jen$VR948E7ryPIZO|fTDU=5MJal&j)5iN*SQlYQZJ63}KevKQ z=t|0=HQ_KNr18WQoyMrjtTKhO37d&gKWm#p{B$W>Ty&w|;6!(hWZscTs#M9kOwM#u zRDdR}KI-KuAyyOCC=Ymed2uyq6E^L+$lELH_)iV(zGSkrQf1Ro!%fG&4!FNcqbupK zyWM7LMB|zo;LqN?yJ*F}+42J!g}=_24*SlDbX%2QVyH zKi5xlM~1Exe0;cznd1YuBvdGjI}TpXuZ^W0Dgr9YYIMG6&0;H>E7*`nAt~Al$TcyX zL+0P~lF4D6zLb6ajUw8x%GH!bUeYzcri7efa;nF4A5RD>boLL4Aru-X`dL&Px$#x& zTtafQmVd#)E{mSDUF;`hqvcan_Fu@*EB7u3ArX?$4&@y8BXk*v`W1R_Sf^{EC0!w& z8yTySG#lBZ>(N=2L6$a*a|!8;g74ZbnnHPISC5D=QL6CV55p`7WkkF|A|)z?pdITr zC5ninb=R^03MDz!u)DAY@2-5+A*TG32QoM}mD?yD_f{k>s6 zY>vBA=U01qq~6atF+ib6`gAD;;>3b0-#;9e%~jr5QpPi1_Hs=M>E>1SD4M6Z)on%S zN*d-?jBt-iiq;&+@pOF&P37>_`3%)wo61s^!Hmt0-_!UshYgFyxe=OE>7%yH40x(*HH9?naxQuybXQQRluR<95JSxbwIut(mcgzW_mq*n?$CXXXF^002ovPDHLkV1iDVSvLRx literal 0 HcmV?d00001 diff --git a/src/assets/img/elo.png b/src/assets/img/elo.png new file mode 100644 index 0000000000000000000000000000000000000000..46707b0550562df4c86c3b1084eff1e4438cc48c GIT binary patch literal 880 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 WUqO2Rb literal 0 HcmV?d00001 diff --git a/src/assets/img/vtex.png b/src/assets/img/vtex.png new file mode 100644 index 0000000000000000000000000000000000000000..c745c7b4e5a24e7611464028405263140fdccc69 GIT binary patch literal 1637 zcmV-r2AcVaP)A(e1O$bWTH0d4F0!-*%F@Lybf0Ob?X2%T&%B{i8i7nZB$SbF@@CF`_uhBj_s+TJ zopXo53yDQ8_)v?-97>y6xLx_p;82?l3A^{_|G02=N)E&04V&F=+k2>Z-M(#a6}a2{ zP=_HV?A6Tlr&S05lvLiFOFuF}4gn4xe!{u+AjFDWw1lPmj^UPOK)Ly4S|EO_8#Vma zC=fZRs`0^t!YFpJN8>F1X>|$U*DM4SoX0vt2S$b}{>^Oq@0_I?76$3+P4YfnQDlQoe++cQP^{Uh3lZm zT>#hD`QTau&@xQk9`cWs0NBPi@@hC1;0KULSZ$WyHCjH z{K42=lx|x2>1tUNi)$cWZI)%%cW1~dPS3^XOa?bAX;|5!Gzer_snrCQnKu{vCp1ekz2+ z=fTlUvtadzYq>26ULg|`e*YUx#e*}1L-@4<{=n}js@$>?jtjSBmlD_Qfz)l0&nuQ^ zLa`)cf@h)#f5p=L{#RE3bS?`^k5!UmLPl*H51$i1YmZcaxGLhw;O9h)sUNI@gv&M-mBiSE3 zlsB((%PL51W^l8UAy9;5M2wr0jPZbnLXgEr%7+{3y_+ze@c+q0PoJ$qb6XDr0Tq|) zyz(%?k{TjegFwLD$zH&_=#zTT4T)Z7l0u?`(lUA^63r6bveI*2xN}}b@8n?9_Jc*qPWMVjYNs$`mFiLoM6Px9Y^7^3G%y8ddQ{ESl|;ujfr6(MuL`7D4j-w zKC2BDyItlQA0A4H3y0e#Ga^GmV9~m;Ff9=?SA?VbR4+=YAdZR9BZ^9&#?~&RCmS$m zb-?LzAy}ivwffu0m|~Rmw0HK>rjZi~#zY&hDeFFNum*eH>&s%?U= z@QI+iHsgCGY+t(yGvni-3)0}L!XmsdZ7PD5N?dR6K%3cw`N_#Bn0W<3*{x`=4#K(0 zTX>2pgWQ$#P+3)viN;jQr#YOX+;wx_avaI8z`9qm(Ad(25K6LXp!nn`Pq5vZmqug`0SN#T@+dTbVDn?t75Y^m%;K?WXO$eTdR&u_SE@-u>Yx zY&!Te2AnR$hUzgROM&ptI20VIlS`l}i81)I;yTXK(MiSe)X7GqCQTsX8YCq|qoutE zbxoc4r==T$D9Sq0lj3Nc!K>RX8)L)Bq81dMze@At;46G4s2ZTe*a0;6n31>t0Ct@& zM0tH9zQ|pT9k0EFXOd!IQFfvoO}Kb!0R4k@d0uOW8Hwa_QB<`@(B906!iy;S>l*s{ zZ7@WKq2@-*e{`KJu0lbnXGcJ!r*!CKIV!6gcVoo7=jWy&ma6}f@>(okJRObAU2wTX zT)5JJ1VbcR+s)9Zd1!+*R3VAvjt|`~|6aJm`gnvl$WU|?5r7!Bpv3ml;>y8e j4hfu9A+nQrf&jt4(RCxvG%L$W00000NkvXXu0mjfk|`1r literal 0 HcmV?d00001 diff --git a/src/assets/svg/arrow.svg b/src/assets/svg/arrowRight.svg similarity index 100% rename from src/assets/svg/arrow.svg rename to src/assets/svg/arrowRight.svg diff --git a/src/assets/svg/arrowTop.svg b/src/assets/svg/arrowTop.svg new file mode 100644 index 0000000..4928a01 --- /dev/null +++ b/src/assets/svg/arrowTop.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/svg/facebook.svg b/src/assets/svg/facebook.svg new file mode 100644 index 0000000..1d90a05 --- /dev/null +++ b/src/assets/svg/facebook.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/src/assets/svg/instagram.svg b/src/assets/svg/instagram.svg new file mode 100644 index 0000000..22c8446 --- /dev/null +++ b/src/assets/svg/instagram.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/assets/svg/linkedin.svg b/src/assets/svg/linkedin.svg new file mode 100644 index 0000000..ca97a86 --- /dev/null +++ b/src/assets/svg/linkedin.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/assets/svg/m3.svg b/src/assets/svg/m3.svg new file mode 100644 index 0000000..0eeb905 --- /dev/null +++ b/src/assets/svg/m3.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/assets/svg/twitter.svg b/src/assets/svg/twitter.svg new file mode 100644 index 0000000..f57be2c --- /dev/null +++ b/src/assets/svg/twitter.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/svg/vtex.svg b/src/assets/svg/vtex.svg new file mode 100644 index 0000000..7e8d17b --- /dev/null +++ b/src/assets/svg/vtex.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/assets/svg/whatsapp.svg b/src/assets/svg/whatsapp.svg new file mode 100644 index 0000000..2314673 --- /dev/null +++ b/src/assets/svg/whatsapp.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/svg/youtube.svg b/src/assets/svg/youtube.svg new file mode 100644 index 0000000..a6855b9 --- /dev/null +++ b/src/assets/svg/youtube.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/styles/partials/header/Form.module.scss b/src/components/Header/Form.module.scss similarity index 100% rename from src/styles/partials/header/Form.module.scss rename to src/components/Header/Form.module.scss diff --git a/src/components/Header/Form.tsx b/src/components/Header/Form.tsx index a1c0935..5c2b207 100644 --- a/src/components/Header/Form.tsx +++ b/src/components/Header/Form.tsx @@ -2,7 +2,7 @@ import React from "react"; // Estilos -import styleForm from "../../styles/partials/header/Form.module.scss"; +import styleForm from "./Form.module.scss"; // Imagem import search from "../../assets/svg/search.svg"; diff --git a/src/styles/partials/header/HeaderWrapper.module.scss b/src/components/Header/HeaderWrapper.module.scss similarity index 100% rename from src/styles/partials/header/HeaderWrapper.module.scss rename to src/components/Header/HeaderWrapper.module.scss diff --git a/src/components/Header/LogoM3.tsx b/src/components/Header/LogoM3.tsx index 97aa835..474f58d 100644 --- a/src/components/Header/LogoM3.tsx +++ b/src/components/Header/LogoM3.tsx @@ -2,7 +2,11 @@ import logoM3 from "../../assets/svg/logo.svg"; const LogoM3 = () => { - return M3 Academy; + return ( + + M3 Academy{" "} + + ); }; export { LogoM3 }; diff --git a/src/styles/partials/header/Menu.module.scss b/src/components/Header/Menu.module.scss similarity index 72% rename from src/styles/partials/header/Menu.module.scss rename to src/components/Header/Menu.module.scss index 1404bd4..4854b19 100644 --- a/src/styles/partials/header/Menu.module.scss +++ b/src/components/Header/Menu.module.scss @@ -1,5 +1,6 @@ -.header-menu { +.menu { display: none; + cursor: pointer; @media (max-width: 1024px) { display: flex; diff --git a/src/components/Header/Menu.tsx b/src/components/Header/Menu.tsx index 63d9dce..63a74a4 100644 --- a/src/components/Header/Menu.tsx +++ b/src/components/Header/Menu.tsx @@ -2,15 +2,15 @@ import React from "react"; // Estilos -import styleMenu from "../../styles/partials/header/Menu.module.scss"; +import styleMenu from "./Menu.module.scss"; // Imagens import menu from "../../assets/svg/menu.svg"; const Menu = () => { return ( -
- Menu +
+ Menu
); }; diff --git a/src/styles/partials/header/Nav.module.scss b/src/components/Header/Nav.module.scss similarity index 83% rename from src/styles/partials/header/Nav.module.scss rename to src/components/Header/Nav.module.scss index 01c4621..677f554 100644 --- a/src/styles/partials/header/Nav.module.scss +++ b/src/components/Header/Nav.module.scss @@ -23,5 +23,10 @@ text-transform: uppercase; color: #fff; text-decoration: none; + transition: all 0.3s linear; + + &:hover { + font-weight: 500; + } } } diff --git a/src/components/Header/Nav.tsx b/src/components/Header/Nav.tsx index a72498e..0e33e14 100644 --- a/src/components/Header/Nav.tsx +++ b/src/components/Header/Nav.tsx @@ -2,22 +2,22 @@ import React from "react"; // Estilos -import styleNav from "../../styles/partials/header/Nav.module.scss"; +import styleNav from "./Nav.module.scss"; const Nav = () => { return ( diff --git a/src/components/Header/User.module.scss b/src/components/Header/User.module.scss new file mode 100644 index 0000000..a4a452a --- /dev/null +++ b/src/components/Header/User.module.scss @@ -0,0 +1,30 @@ +.user { + display: flex; + align-items: center; + + a { + color: #fff; + font-size: 14px; + font-weight: 400; + line-height: 16px; + text-transform: uppercase; + text-decoration: none; + transition: all 0.3s linear; + + &:first-child { + margin-right: 55px; + } + + &:hover { + font-weight: 500; + } + + @media (max-width: 1024px) { + margin-right: 0; + + &:first-child { + display: none; + } + } + } +} diff --git a/src/components/Header/User.tsx b/src/components/Header/User.tsx index 262484c..40b8ac2 100644 --- a/src/components/Header/User.tsx +++ b/src/components/Header/User.tsx @@ -2,17 +2,19 @@ import React from "react"; // Estilos -import styleUser from "../../styles/partials/header/User.module.scss"; +import styleUser from "./User.module.scss"; // Imagem import cart from "../../assets/svg/cart.svg"; const User = () => { return ( -
-

Entrar

+ ); }; diff --git a/src/components/footer/FooterBottom.module.scss b/src/components/footer/FooterBottom.module.scss new file mode 100644 index 0000000..e1a18d2 --- /dev/null +++ b/src/components/footer/FooterBottom.module.scss @@ -0,0 +1,98 @@ +.footerBottom { + padding: 15px 100px; + background-color: #000; + color: #fff; + display: flex; + align-items: center; + justify-content: space-between; + + @media (max-width: 1024px) { + display: grid; + padding: 20px 16px; + grid-template-rows: repeat(3, max-content); + } + + .footerBottom-text { + grid-row: 2; + + p { + max-width: 42ch; + text-transform: capitalize; + font-size: 10px; + font-weight: 400; + line-height: 12px; + + @media (max-width: 1024px) { + margin: 20px 0 15px 0; + } + } + } + + .footerBottom-icons { + display: flex; + align-items: center; + + div { + margin-right: 12px; + + @media (max-width: 375px) { + margin-right: 11px; + img { + width: 30px; + } + } + + @media (max-width: 374px) { + margin-right: 4px; + } + + &:last-child { + img { + @media (max-width: 375px) { + margin-left: 11px; + width: 45px; + } + + @media (max-width: 374px) { + margin-left: 4px; + } + + margin-left: 12px; + } + } + + @media (min-width: 376px) and (max-width: 1024px) { + margin-right: 10px; + } + } + + span { + border-left: 2px solid #c4c4c4; + height: 25px; + margin-bottom: 5px; + } + } + + .footerBottom-credits { + display: flex; + align-items: center; + + p { + font-size: 10px; + font-weight: 400; + line-height: 12px; + margin-right: 12px; + } + + .footerBottom-credits-powered { + display: flex; + align-items: center; + margin-right: 13px; + } + + .footerBottom-credits-developed { + display: flex; + align-items: center; + } + } +} diff --git a/src/components/footer/FooterBottom.tsx b/src/components/footer/FooterBottom.tsx new file mode 100644 index 0000000..928eecd --- /dev/null +++ b/src/components/footer/FooterBottom.tsx @@ -0,0 +1,81 @@ +// Bibliotecas +import React from "react"; + +// Imagens +import mastercard from "../../assets/img/master.png"; +import visa from "../../assets/img/visa.png"; +import diners from "../../assets/img/diners.png"; +import elo from "../../assets/img/elo.png"; +import hiper from "../../assets/img/hiper.png"; +import pagseguro from "../../assets/img/pagseguro.png"; +import boleto from "../../assets/img/boleto.png"; +import vtexcertified from "../../assets/img/vtex.png"; + +import m3 from "../../assets/svg/m3.svg"; +import vtex from "../../assets/svg/vtex.svg"; + +// Estilos +import styleFooterBottom from "./FooterBottom.module.scss"; + +const FooterBottom = () => { + return ( +
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor +

+
+ +
+
+ MasterCard +
+ +
+ Visa +
+ +
+ Diners +
+ +
+ Elo +
+ +
+ HiperCard +
+ +
+ PagSeguro +
+ +
+ Boleto +
+ + + +
+ VTEX +
+
+ +
+
+

Powered by

+ VTEX +
+ +
+

Developed by

+ M3 +
+
+
+ ); +}; + +export { FooterBottom }; diff --git a/src/components/footer/FooterTop.module.scss b/src/components/footer/FooterTop.module.scss new file mode 100644 index 0000000..1d15b38 --- /dev/null +++ b/src/components/footer/FooterTop.module.scss @@ -0,0 +1,78 @@ +.footerTop { + padding: 50px 100px; + display: flex; + justify-content: space-between; + + @media (max-width: 1024px) { + display: block; + padding: 24px 16px; + } + + h3 { + margin-bottom: 12px; + font-size: 14px; + font-weight: 500; + line-height: 16px; + text-transform: uppercase; + + @media (max-width: 1024px) { + text-transform: capitalize; + } + } + + li { + list-style: none; + margin-bottom: 12px; + + a { + font-size: 12px; + font-weight: 400; + line-height: 14px; + text-decoration: none; + color: #303030; + } + + &:last-child { + text-decoration: underline; + } + } + + .footerTop-fale-conosco { + p:nth-child(2), + p:nth-child(4) { + font-size: 12px; + font-weight: 500; + line-height: 14px; + max-width: 20ch; + } + + p:nth-child(3), + p:nth-child(5) { + font-weight: 400; + margin: 12px 0; + font-size: 12px; + font-weight: 400; + line-height: 14px; + + &:last-child { + text-decoration: underline; + } + } + } + + .footerTop-icons { + .footerTop-icons-wrapper { + a { + margin-left: 10px; + + &:first-child { + margin-left: 0px; + } + } + } + + p { + margin-top: 12px; + } + } +} diff --git a/src/components/footer/FooterTop.tsx b/src/components/footer/FooterTop.tsx new file mode 100644 index 0000000..b7a6a62 --- /dev/null +++ b/src/components/footer/FooterTop.tsx @@ -0,0 +1,86 @@ +// Bibliotecas +import React from "react"; + +// Imagens +import facebook from "../../assets/svg/facebook.svg"; +import instragrm from "../../assets/svg/instagram.svg"; +import twitter from "../../assets/svg/twitter.svg"; +import youtube from "../../assets/svg/youtube.svg"; +import linkedin from "../../assets/svg/linkedin.svg"; + +// Estilos +import styleFooterTop from "./FooterTop.module.scss"; + +const FooterTop = () => { + return ( +
+
+

Institucional

+ +
+ +
+

Dúvidas

+ +
+ +
+

Fale Conosco

+

Atendimento Ao Consumidor

+

(11) 4159-9504

+

Atendimento Online

+

(11) 99433-8825

+
+ +
+ + +

www.loremipsum.com

+
+
+ ); +}; + +export { FooterTop }; diff --git a/src/components/footer/Newsletter.module.scss b/src/components/footer/Newsletter.module.scss new file mode 100644 index 0000000..5b560dd --- /dev/null +++ b/src/components/footer/Newsletter.module.scss @@ -0,0 +1,78 @@ +.newsletter { + margin-top: 70px; + border: 1px solid #000; + border-left: none; + border-right: none; + display: flex; + justify-content: center; + + @media (max-width: 1024px) { + display: block; + } + + .newsletter-wrapper { + padding: 16px 0; + + @media (max-width: 1024px) { + padding: 16px; + } + + h2 { + font-size: 18px; + font-weight: 500; + line-height: 21px; + letter-spacing: 0.05em; + text-transform: uppercase; + margin-bottom: 7px; + + @media (max-width: 1024px) { + font-size: 14px; + line-height: 16px; + } + } + + .newsletter-form { + input { + height: 42px; + width: 340px; + border-radius: 4px; + padding: 13px 16px 13px 16px; + outline: none; + border: 1px solid #e5e5e5; + margin-right: 8px; + + @media (max-width: 1024px) { + margin: 0 0 16px 0; + border-radius: 0; + border: 1px solid #c4c4c4; + width: 100%; + } + + &::placeholder { + color: #c4c4c4; + } + } + + button { + height: 42px; + width: 126px; + border-radius: 4px; + background: #000000; + color: #fff; + font-size: 12px; + font-weight: 700; + line-height: 14px; + letter-spacing: 0.05em; + text-transform: uppercase; + outline: none; + border: none; + + @media (max-width: 1024px) { + width: 100%; + height: 50px; + border-radius: 0; + } + } + } + } +} diff --git a/src/components/footer/Newsletter.tsx b/src/components/footer/Newsletter.tsx new file mode 100644 index 0000000..960faa8 --- /dev/null +++ b/src/components/footer/Newsletter.tsx @@ -0,0 +1,22 @@ +// Bibliotecas +import React from "react"; + +// Estilos +import styleNewsletter from "./Newsletter.module.scss"; + +const Newsletter = () => { + return ( +
+
+

Assine nossa newsletter

+ +
+ + +
+
+
+ ); +}; + +export { Newsletter }; diff --git a/src/components/global/ButtonsGlobal.module.scss b/src/components/global/ButtonsGlobal.module.scss new file mode 100644 index 0000000..aae3330 --- /dev/null +++ b/src/components/global/ButtonsGlobal.module.scss @@ -0,0 +1,18 @@ +.buttons { + display: flex; + flex-direction: column; + position: fixed; + right: 16px; + bottom: 16px; + + div { + display: flex; + justify-content: center; + margin-top: 5px; + width: 34px; + height: 34px; + border-radius: 50%; + background-color: #c4c4c4; + cursor: pointer; + } +} diff --git a/src/components/global/ButtonsGlobal.tsx b/src/components/global/ButtonsGlobal.tsx new file mode 100644 index 0000000..36cd654 --- /dev/null +++ b/src/components/global/ButtonsGlobal.tsx @@ -0,0 +1,33 @@ +// Bibliotecas +import React from "react"; + +// Estilos +import styleButtons from "./ButtonsGlobal.module.scss"; + +// Imagens +import whatsapp from "../../assets/svg/whatsapp.svg"; +import arrow from "../../assets/svg/arrowTop.svg"; + +const ButtonsGlobal = () => { + function scrollTop() { + window.scrollTo(0, 0); + } + + return ( +
+ + WhatsApp + + +
+ Voltar para cima +
+
+ ); +}; + +export { ButtonsGlobal }; diff --git a/src/styles/partials/institucional/Breadcrumb.module.scss b/src/components/section/Breadcrumb.module.scss similarity index 95% rename from src/styles/partials/institucional/Breadcrumb.module.scss rename to src/components/section/Breadcrumb.module.scss index 18c7456..aff3c99 100644 --- a/src/styles/partials/institucional/Breadcrumb.module.scss +++ b/src/components/section/Breadcrumb.module.scss @@ -1,4 +1,4 @@ -.nav-main { +.breadcrumb { padding: 30px 100px 0 100px; display: flex; align-items: center; diff --git a/src/components/institucional/Breadcrumb.tsx b/src/components/section/Breadcrumb.tsx similarity index 61% rename from src/components/institucional/Breadcrumb.tsx rename to src/components/section/Breadcrumb.tsx index e17bf86..69c92fb 100644 --- a/src/components/institucional/Breadcrumb.tsx +++ b/src/components/section/Breadcrumb.tsx @@ -2,15 +2,15 @@ import React from "react"; // Estilos -import styleBreadcrumb from "../../styles/partials/institucional/Breadcrumb.module.scss"; +import styleBreadcrumb from "./Breadcrumb.module.scss"; // Imagens import home from "../../assets/svg/home.svg"; -import arrow from "../../assets/svg/arrow.svg"; +import arrow from "../../assets/svg/arrowRight.svg"; const Breadcrumb = () => { return ( -
+
Home Flecha

Institucional

diff --git a/src/styles/partials/institucional/InstitucionalContent.module.scss b/src/components/section/InstitucionalContent.module.scss similarity index 94% rename from src/styles/partials/institucional/InstitucionalContent.module.scss rename to src/components/section/InstitucionalContent.module.scss index 525646a..e60aada 100644 --- a/src/styles/partials/institucional/InstitucionalContent.module.scss +++ b/src/components/section/InstitucionalContent.module.scss @@ -1,4 +1,4 @@ -.accordion-content { +.institucionalContent{ h2 { margin: 12px 0; font-size: 24px; diff --git a/src/components/institucional/InstitucionalContent.tsx b/src/components/section/InstitucionalContent.tsx similarity index 90% rename from src/components/institucional/InstitucionalContent.tsx rename to src/components/section/InstitucionalContent.tsx index dd34f04..24c0180 100644 --- a/src/components/institucional/InstitucionalContent.tsx +++ b/src/components/section/InstitucionalContent.tsx @@ -2,11 +2,11 @@ import React from "react"; // Estilos -import styleInstitucionalContent from "../../styles/partials/institucional/InstitucionalContent.module.scss"; +import styleInstitucionalContent from "./InstitucionalContent.module.scss"; const InstitucionalContent = () => { return ( -
+

Sobre

diff --git a/src/styles/partials/institucional/NavInstitucional.module.scss b/src/components/section/NavInstitucional.module.scss similarity index 96% rename from src/styles/partials/institucional/NavInstitucional.module.scss rename to src/components/section/NavInstitucional.module.scss index ce82a0f..75b7fe8 100644 --- a/src/styles/partials/institucional/NavInstitucional.module.scss +++ b/src/components/section/NavInstitucional.module.scss @@ -1,4 +1,4 @@ -.accordion-nav { +.NavInstitucional { border-right: 1px solid #000; margin-right: 30px; diff --git a/src/components/institucional/NavInstitucional.tsx b/src/components/section/NavInstitucional.tsx similarity index 81% rename from src/components/institucional/NavInstitucional.tsx rename to src/components/section/NavInstitucional.tsx index ee58cb8..9247a23 100644 --- a/src/components/institucional/NavInstitucional.tsx +++ b/src/components/section/NavInstitucional.tsx @@ -2,11 +2,11 @@ import React from "react"; // Estilos -import styleNavInstitucional from "../../styles/partials/institucional/NavInstitucional.module.scss"; +import styleNavInstitucional from "./NavInstitucional.module.scss"; const NavInstitucional = () => { return ( -