From 0f489d1f7cc3b77d3ffcb8c8fa1fd7f4f779af65 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Naian=20F=C3=A9lix?= Date: Tue, 11 Oct 2022 14:31:37 -0300 Subject: [PATCH] feat: Adiciona footer desktop e mobile --- assets/image/icon-facebook.svg | 3 +++ assets/image/icon-instagram.svg | 5 +++++ assets/image/icon-youtube.svg | 3 +++ assets/styles/main.css | 31 ++++++++++++++++++++++++++++++- index.html | 8 ++++++++ 5 files changed, 49 insertions(+), 1 deletion(-) create mode 100644 assets/image/icon-facebook.svg create mode 100644 assets/image/icon-instagram.svg create mode 100644 assets/image/icon-youtube.svg diff --git a/assets/image/icon-facebook.svg b/assets/image/icon-facebook.svg new file mode 100644 index 0000000..061ff85 --- /dev/null +++ b/assets/image/icon-facebook.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/image/icon-instagram.svg b/assets/image/icon-instagram.svg new file mode 100644 index 0000000..9221bab --- /dev/null +++ b/assets/image/icon-instagram.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/assets/image/icon-youtube.svg b/assets/image/icon-youtube.svg new file mode 100644 index 0000000..de6f9a7 --- /dev/null +++ b/assets/image/icon-youtube.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/styles/main.css b/assets/styles/main.css index ec990a6..2964a30 100644 --- a/assets/styles/main.css +++ b/assets/styles/main.css @@ -183,6 +183,31 @@ body { max-width: 1360px; width: 100%; } +footer { + background-color: #000000; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + padding: 38px 0; +} + +.footer-text{ + color: #BDBDBD; + font-weight: 400; + font-size: 10px; + line-height: 12px; + text-transform: uppercase; + padding-top: 17px; + text-align: center; +} + +.footer-icon { + display: flex; + column-gap: 16px; +} + + @media screen and (min-width: 769px) and (max-width: 1200px) { @@ -293,7 +318,7 @@ body { } -@media screen and (max-width: 414px) { +@media screen and (max-width: 415px) { .main-banner { content: url('../image/main-banner-mobile.png'); @@ -302,6 +327,10 @@ body { .header-logo { padding: 24px 0 33px; } + + footer { + padding: 32px 18.35%; + } } @media screen and (max-width: 290px) { diff --git a/index.html b/index.html index f2771d8..0708b3f 100644 --- a/index.html +++ b/index.html @@ -121,5 +121,13 @@ + \ No newline at end of file