diff --git a/src/components/Address/Address.tsx b/src/components/Address/Address.tsx index bf006c2..1e88714 100644 --- a/src/components/Address/Address.tsx +++ b/src/components/Address/Address.tsx @@ -1,7 +1,8 @@ import React from "react"; +import styles from "./address.module.scss"; const Address = () => { return ( -
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
diff --git a/src/components/Address/address.module.scss b/src/components/Address/address.module.scss new file mode 100644 index 0000000..9b4ad43 --- /dev/null +++ b/src/components/Address/address.module.scss @@ -0,0 +1,19 @@ +.endereco { + width: 234px; + height: 24px; + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-size: 10px; + line-height: 12px; + text-transform: capitalize; + color: white; + margin: 0 0 0 0; + + @media screen and (min-width: 2500px) { + width: 467px; + height: 47px; + font-size: 20px; + line-height: 23px; + } +} diff --git a/src/components/Caminhos/caminhos.module.scss b/src/components/Caminhos/caminhos.module.scss index 6c1db67..3c5b5dc 100644 --- a/src/components/Caminhos/caminhos.module.scss +++ b/src/components/Caminhos/caminhos.module.scss @@ -2,6 +2,8 @@ display: flex; flex-direction: row; gap: 5px; + align-items: baseline; + margin: 30px 0 0 100px; p { font-family: "Roboto"; font-style: normal; diff --git a/src/components/DevelopedBy/developedBy.module.scss b/src/components/DevelopedBy/developedBy.module.scss index 470f3ca..929b98c 100644 --- a/src/components/DevelopedBy/developedBy.module.scss +++ b/src/components/DevelopedBy/developedBy.module.scss @@ -3,6 +3,27 @@ flex-direction: row; align-items: center; p { - margin-right: 30px; + display: flex; + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-size: 10px; + line-height: 12px; + + text-transform: capitalize; + margin-right: 13px; + color: white; + margin: 0 13px 0 0; + @media screen and (min-width: 2500px) { + font-size: 20px; + } + } + img { + width: 28.66px; + height: 15.65px; + @media screen and (min-width: 2500px) { + width: 34.15px; + height: 23.87px; + } } } diff --git a/src/components/Newsletter/newsletter.module.scss b/src/components/Newsletter/newsletter.module.scss index 2134542..f9c9d7f 100644 --- a/src/components/Newsletter/newsletter.module.scss +++ b/src/components/Newsletter/newsletter.module.scss @@ -1,9 +1,17 @@ .newsForm { + width: 474px; + height: 72px; display: flex; flex-direction: column; font-weight: 500; font-size: 18px; + font-family: "Roboto"; font-variant: small-caps; + line-height: 21px; + letter-spacing: 0.05em; + font-style: normal; + color: #303030; + margin: 16px 0 16px 0; @media screen and (min-width: 2500px) { font-size: 36px; } @@ -26,6 +34,7 @@ font-weight: 400; font-size: 14px; color: #c4c4c4; + font-family: "Roboto"; @media screen and (min-width: 2500px) { font-size: 28px; } @@ -36,6 +45,7 @@ } } .newsForm-btn { + display: flex; width: 126px; height: 42px; background: #000000; @@ -45,6 +55,8 @@ color: white; font-weight: 700; font-size: 12px; + align-items: center; + justify-content: center; @media screen and (min-width: 2500px) { width: 246px; height: 59px; diff --git a/src/components/Payments/Payments.tsx b/src/components/Payments/Payments.tsx index 668687f..a6720ae 100644 --- a/src/components/Payments/Payments.tsx +++ b/src/components/Payments/Payments.tsx @@ -38,7 +38,7 @@ const Payments = () => { }; const VtexPci = () => { - return ; + return ; }; export { Payments, VtexPci }; diff --git a/src/components/Payments/payments.module.scss b/src/components/Payments/payments.module.scss index 2d88400..bffead2 100644 --- a/src/components/Payments/payments.module.scss +++ b/src/components/Payments/payments.module.scss @@ -1,4 +1,25 @@ .paymentsList { display: flex; flex-direction: row; + gap: 12px; + padding: 0 0 0 0; +} +.paymentsItem { + img { + width: 35px; + height: 20.2px; + @media screen and (min-width: 2500px) { + width: 70px; + height: 40.25px; + } + } +} + +.paymentsPci { + width: 54.61px; + height: 34px; + @media screen and (min-width: 2500px) { + width: 106px; + height: 66px; + } } diff --git a/src/components/PoweredBy/assets/image/vtexLogo.png b/src/components/PoweredBy/assets/image/vtexLogo.png index 867c3bb..8f08de3 100644 Binary files a/src/components/PoweredBy/assets/image/vtexLogo.png and b/src/components/PoweredBy/assets/image/vtexLogo.png differ diff --git a/src/components/PoweredBy/poweredBy.module.scss b/src/components/PoweredBy/poweredBy.module.scss index 2b531b4..3bb5f42 100644 --- a/src/components/PoweredBy/poweredBy.module.scss +++ b/src/components/PoweredBy/poweredBy.module.scss @@ -3,6 +3,27 @@ flex-direction: row; align-items: center; p { - margin-right: 30px; + display: flex; + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-size: 10px; + line-height: 12px; + + text-transform: capitalize; + margin-right: 13px; + color: white; + margin: 0 13px 0 0; + @media screen and (min-width: 2500px) { + font-size: 20px; + } + } + img { + width: 44.92px; + height: 16px; + @media screen and (min-width: 2500px) { + width: 84.22px; + height: 30px; + } } } diff --git a/src/components/Socials/Socials.tsx b/src/components/Socials/Socials.tsx index aee8b92..ef39412 100644 --- a/src/components/Socials/Socials.tsx +++ b/src/components/Socials/Socials.tsx @@ -11,19 +11,29 @@ const Socials = () => {|
+