diff --git a/desafio-5/src/components/assets/icons/Facebook.svg b/desafio-5/src/components/assets/icons/Facebook.svg
new file mode 100644
index 0000000..ed10642
--- /dev/null
+++ b/desafio-5/src/components/assets/icons/Facebook.svg
@@ -0,0 +1,16 @@
+
diff --git a/desafio-5/src/components/assets/icons/Instagram.svg b/desafio-5/src/components/assets/icons/Instagram.svg
new file mode 100644
index 0000000..e95de2b
--- /dev/null
+++ b/desafio-5/src/components/assets/icons/Instagram.svg
@@ -0,0 +1,18 @@
+
diff --git a/desafio-5/src/components/assets/icons/Linkedin.svg b/desafio-5/src/components/assets/icons/Linkedin.svg
new file mode 100644
index 0000000..d289af5
--- /dev/null
+++ b/desafio-5/src/components/assets/icons/Linkedin.svg
@@ -0,0 +1,18 @@
+
diff --git a/desafio-5/src/components/assets/icons/Svg.svg b/desafio-5/src/components/assets/icons/Svg.svg
new file mode 100644
index 0000000..d289af5
--- /dev/null
+++ b/desafio-5/src/components/assets/icons/Svg.svg
@@ -0,0 +1,18 @@
+
diff --git a/desafio-5/src/components/assets/icons/Twiter.svg b/desafio-5/src/components/assets/icons/Twiter.svg
new file mode 100644
index 0000000..682da7b
--- /dev/null
+++ b/desafio-5/src/components/assets/icons/Twiter.svg
@@ -0,0 +1,11 @@
+
diff --git a/desafio-5/src/components/assets/icons/Youtube.svg b/desafio-5/src/components/assets/icons/Youtube.svg
new file mode 100644
index 0000000..6ce61e0
--- /dev/null
+++ b/desafio-5/src/components/assets/icons/Youtube.svg
@@ -0,0 +1,11 @@
+
diff --git a/desafio-5/src/components/modules/footer.module.scss b/desafio-5/src/components/modules/footer.module.scss
index f5c46d3..3ad1bae 100644
--- a/desafio-5/src/components/modules/footer.module.scss
+++ b/desafio-5/src/components/modules/footer.module.scss
@@ -76,7 +76,42 @@
justify-content: space-between;
padding: 50px 100px;
align-items: flex-start;
- background: pink;
+ &_menu{
+ display: flex;
+ width: 65.556%;
+ height: 140px;
+ }
+ &_media{
+ display: flex;
+ flex-direction: column;
+ width: 20%;
+ gap: 12px;
+ a{
+ color: $-black-3030;
+ font-family: 'Roboto',sans-serif;
+ font-style: normal;
+ font-weight: 400;
+ font-size: 14px;
+ line-height: 16px;
+ }
+ &_MediaWraaper{
+ width: 100%;
+ max-height: 6.484vh;
+ fieldset{
+ display: flex;
+ gap: 10px;
+ border: 0;
+ height: 100%;
+ max-height: 6.484vh;
+ a{
+ width:16.21%;
+ img{
+ width: 100%;
+ }
+ }
+ }
+ }
+ }
}
&_bottom{
background: $-black;
diff --git a/desafio-5/src/components/scripts/celulas/FooterTop.tsx b/desafio-5/src/components/scripts/celulas/FooterTop.tsx
index a039706..b2fc642 100644
--- a/desafio-5/src/components/scripts/celulas/FooterTop.tsx
+++ b/desafio-5/src/components/scripts/celulas/FooterTop.tsx
@@ -4,17 +4,21 @@ import { SocialMedia } from "./SocialMedia";
interface Calsses {
DadClass?: string;
+ wrapperClass?: string;
+ MediaCLass?: string;
+ MenuClass?: string;
}
export const TopFooter: React.FC = (
- {DadClass}
+ {DadClass, MediaCLass,wrapperClass,MenuClass}
) => {
return(
-
-
+
+
)
};
diff --git a/desafio-5/src/components/scripts/celulas/SocialMedia.tsx b/desafio-5/src/components/scripts/celulas/SocialMedia.tsx
index cf436d9..aab45bf 100644
--- a/desafio-5/src/components/scripts/celulas/SocialMedia.tsx
+++ b/desafio-5/src/components/scripts/celulas/SocialMedia.tsx
@@ -1,18 +1,21 @@
import React from "react"
+import {SocialImages} from "../moleculas/SocialImages"
interface Calsses {
wrapperClass?: string;
+ MediaCLass?: string;
}
export const SocialMedia: React.FC = (
- {wrapperClass}
+ {wrapperClass,MediaCLass}
) => {
return(
)
};
\ No newline at end of file
diff --git a/desafio-5/src/components/scripts/footer.tsx b/desafio-5/src/components/scripts/footer.tsx
index 500dc65..4f58002 100644
--- a/desafio-5/src/components/scripts/footer.tsx
+++ b/desafio-5/src/components/scripts/footer.tsx
@@ -14,7 +14,11 @@ const Footer = () =>{
FormClass={FooterStyles.footer_wrapper_Form__Newsletter}
Errorclass={FooterStyles.hiden}
/>
-
+
= (
+ {MediaCLass}
+) => {
+ return(
+
+ )
+};
\ No newline at end of file
diff --git a/desafio-5/src/components/utils/Variables.scss b/desafio-5/src/components/utils/Variables.scss
index f97646c..72910bf 100644
--- a/desafio-5/src/components/utils/Variables.scss
+++ b/desafio-5/src/components/utils/Variables.scss
@@ -1,6 +1,7 @@
// colors
$-black : #000000;
$-black-100E : #100D0E;
+$-black-3030 :#303030;
$-white:#ffffff;
$-gray: #D6D6D6;
$-gray-light:#e5e5e5;