From bb005553ca850becca1006428b39d5d3ee94c93d Mon Sep 17 00:00:00 2001
From: Sayuck <nobrega.m.roberto@gmail.com>
Date: Tue, 12 Oct 2021 18:05:28 -0300
Subject: [PATCH 1/3] criando o footer

Co-authored-by: KessJhones <tavaresjhones14@gmail.com>
Co-authored-by: Giovannabbottino <giovannabbottino@gmail.com>
---
 src/components/Footer/index.tsx  | 37 +++++++++++++++++++++++--
 src/components/Footer/styles.tsx | 46 +++++++++++++++++++++++++++++++-
 src/templates/Base/index.tsx     |  4 +--
 3 files changed, 82 insertions(+), 5 deletions(-)

diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx
index f8c433e..f5e1200 100644
--- a/src/components/Footer/index.tsx
+++ b/src/components/Footer/index.tsx
@@ -1,5 +1,38 @@
-import * as S from './styles';
+import Image from 'next/image';
+import Link from 'next/link';
+
+import Logo from '@public/img/logo.svg';
 
-const Footer = () => <S.Footer>Footer</S.Footer>;
+import * as S from './styles';
 
+const Footer = () => {
+  return (
+    <S.Footer>
+      <S.Logo>
+        <Image
+          src={Logo}
+          width={50}
+          height={50}
+          objectFit="contain"
+          alt="logo"
+        />
+        <h3>MYCHINE</h3>
+      </S.Logo>
+      <S.Links>
+        <Link href="/" passHref>
+          Termos de uso
+        </Link>
+        <Link href="/" passHref>
+          Documentação
+        </Link>
+        <Link href="/" passHref>
+          Repositório
+        </Link>
+        <Link href="/" passHref>
+          Sobre
+        </Link>
+      </S.Links>
+    </S.Footer>
+  );
+};
 export default Footer;
diff --git a/src/components/Footer/styles.tsx b/src/components/Footer/styles.tsx
index febfcb5..9b937be 100644
--- a/src/components/Footer/styles.tsx
+++ b/src/components/Footer/styles.tsx
@@ -1,6 +1,50 @@
-import styled from 'styled-components';
+import styled, { css } from 'styled-components';
+// import { hoverAnimation } from 'UI/animations';
 
 export const Footer = styled.footer`
   grid-area: footer;
   grid-column: 1/-1;
+  align-items: center;
+`;
+
+export const Logo = styled.div`
+  ${({ theme }) => css`
+    position: relative;
+    display: flex;
+    gap: 1rem;
+    align-items: center;
+    margin-right: ${theme.spacings.xlarge};
+    cursor: pointer;
+    color: ${theme.colors.primary};
+    text-shadow: 
+        /* first layer at 1px */ -1px -1px 0px white,
+      0px -1px 0px white, 1px -1px 0px white, -1px 0px 0px white,
+      1px 0px 0px white, -1px 1px 0px white, 0px 1px 0px white,
+      1px 1px 0px white, /* second layer at 2px */ -2px -2px 0px white,
+      -1px -2px 0px white, 0px -2px 0px white, 1px -2px 0px white,
+      2px -2px 0px white, 2px -1px 0px white, 2px 0px 0px white,
+      2px 1px 0px white, 2px 2px 0px white, 1px 2px 0px white, 0px 2px 0px white,
+      -1px 2px 0px white, -2px 2px 0px white, -2px 1px 0px white,
+      -2px 0px 0px white, -2px -1px 0px white;
+
+    @media (max-width: 600px) {
+      margin-right: ${theme.spacings.large};
+    }
+  `}
+`;
+
+export const Links = styled.div`
+  ${({ theme }) => css`
+    display: flex;
+    align-items: center;
+    gap: ${theme.spacings.large};
+
+    @media (max-width: 600px) {
+      gap: calc(${theme.spacings.large} / 2);
+    }
+
+    svg {
+      color: white;
+    }
+  `}
 `;
diff --git a/src/templates/Base/index.tsx b/src/templates/Base/index.tsx
index fedca6d..69983c1 100644
--- a/src/templates/Base/index.tsx
+++ b/src/templates/Base/index.tsx
@@ -1,4 +1,4 @@
-// import Footer from '@components/Footer';
+import Footer from '@components/Footer';
 import Navbar from '@components/Navbar';
 
 import * as S from './styles';
@@ -11,7 +11,7 @@ const BaseTemplate = ({ children }: IBaseTemplateProps) => (
   <S.Container>
     <Navbar />
     <S.Main>{children}</S.Main>
-    {/* <Footer /> */}
+    <Footer />
   </S.Container>
 );
 

From e1672dc2705972e950bee2ad9772aab3c0d0272a Mon Sep 17 00:00:00 2001
From: Sayuck <nobrega.m.roberto@gmail.com>
Date: Tue, 12 Oct 2021 20:58:26 -0300
Subject: [PATCH 2/3] inserindo react icons no footer

Co-authored-by: Giovannabbottino <giovannabbottino@gmail.com>
Co-authored-by: KessJhones <tavaresjhones14@gmail.com>
---
 src/components/Footer/index.tsx  | 62 +++++++++++++++++++++++---------
 src/components/Footer/styles.tsx | 26 ++++++++++++--
 2 files changed, 69 insertions(+), 19 deletions(-)

diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx
index f5e1200..ad28575 100644
--- a/src/components/Footer/index.tsx
+++ b/src/components/Footer/index.tsx
@@ -1,5 +1,7 @@
 import Image from 'next/image';
 import Link from 'next/link';
+import { AiFillGithub } from 'react-icons/ai';
+import { IoGlobeOutline } from 'react-icons/io5';
 
 import Logo from '@public/img/logo.svg';
 
@@ -8,28 +10,56 @@ import * as S from './styles';
 const Footer = () => {
   return (
     <S.Footer>
-      <S.Logo>
-        <Image
-          src={Logo}
-          width={50}
-          height={50}
-          objectFit="contain"
-          alt="logo"
-        />
-        <h3>MYCHINE</h3>
-      </S.Logo>
+      <Link href="/" passHref>
+        <S.Logo>
+          <Image
+            src={Logo}
+            width={50}
+            height={50}
+            objectFit="contain"
+            alt="logo"
+          />
+          <h3>MYCHINE</h3>
+        </S.Logo>
+      </Link>
       <S.Links>
         <Link href="/" passHref>
-          Termos de uso
+          <S.CustomLink> Termos de uso </S.CustomLink>
         </Link>
-        <Link href="/" passHref>
-          Documentação
+        <Link
+          href="https://unbarqdsw2021-1.github.io/2021.1_G7_Mychine_docs/"
+          passHref
+        >
+          <S.CustomLink> Documentação </S.CustomLink>
         </Link>
-        <Link href="/" passHref>
-          Repositório
+        <Link
+          href="https://github.com/UnBArqDsw2021-1/2021.1_G7_Mychine_App"
+          passHref
+        >
+          <S.CustomLink> Repositório</S.CustomLink>
         </Link>
         <Link href="/" passHref>
-          Sobre
+          <S.CustomLink> Sobre </S.CustomLink>
+        </Link>
+      </S.Links>
+      <S.Links>
+        <Link
+          href="https://github.com/UnBArqDsw2021-1/2021.1_G7_Mychine_App"
+          passHref
+        >
+          <S.CustomLink>
+            {' '}
+            <AiFillGithub color="black" size={30} />{' '}
+          </S.CustomLink>
+        </Link>
+        <Link
+          href="https://unbarqdsw2021-1.github.io/2021.1_G7_Mychine_docs/"
+          passHref
+        >
+          <S.CustomLink>
+            {' '}
+            <IoGlobeOutline color="black" size={30} />{' '}
+          </S.CustomLink>
         </Link>
       </S.Links>
     </S.Footer>
diff --git a/src/components/Footer/styles.tsx b/src/components/Footer/styles.tsx
index 9b937be..27e63c7 100644
--- a/src/components/Footer/styles.tsx
+++ b/src/components/Footer/styles.tsx
@@ -4,6 +4,12 @@ import styled, { css } from 'styled-components';
 export const Footer = styled.footer`
   grid-area: footer;
   grid-column: 1/-1;
+  justify-self: center;
+  top: 8px;
+  display: block;
+  z-index: 1;
+  background: #00000050;
+
   align-items: center;
 `;
 
@@ -37,14 +43,28 @@ export const Links = styled.div`
   ${({ theme }) => css`
     display: flex;
     align-items: center;
+    text-align: center;
+
     gap: ${theme.spacings.large};
 
     @media (max-width: 600px) {
       gap: calc(${theme.spacings.large} / 2);
     }
+  `}
+`;
 
-    svg {
-      color: white;
-    }
+export const CustomLink = styled.a`
+  ${({ theme }) => css`
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: ${theme.spacings.small};
+    padding: 1rem;
+    color: black;
+    font-weight: ${theme.font.weight.light};
+    font-size: ${theme.font.sizes.medium};
+    text-decoration: none;
+    text-shadow: 1px 1px 1px #333;
+    cursor: pointer;
   `}
 `;

From 706c1d941cf562fd44dc9290a7a33c55d1e5806b Mon Sep 17 00:00:00 2001
From: Sayuck <nobrega.m.roberto@gmail.com>
Date: Tue, 12 Oct 2021 21:43:43 -0300
Subject: [PATCH 3/3] centralizando os itens do footer

Co-authored-by: KessJhones <tavaresjhones14@gmail.com>
Co-authored-by: Giovannabbottino <giovannabbottino@gmail.com>
---
 src/components/Footer/index.tsx  | 2 +-
 src/components/Footer/styles.tsx | 9 +++------
 src/styles/global.tsx            | 1 +
 3 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx
index ad28575..a68e556 100644
--- a/src/components/Footer/index.tsx
+++ b/src/components/Footer/index.tsx
@@ -19,7 +19,7 @@ const Footer = () => {
             objectFit="contain"
             alt="logo"
           />
-          <h3>MYCHINE</h3>
+          <h2>MYCHINE</h2>
         </S.Logo>
       </Link>
       <S.Links>
diff --git a/src/components/Footer/styles.tsx b/src/components/Footer/styles.tsx
index 27e63c7..ff47ba5 100644
--- a/src/components/Footer/styles.tsx
+++ b/src/components/Footer/styles.tsx
@@ -1,22 +1,19 @@
 import styled, { css } from 'styled-components';
-// import { hoverAnimation } from 'UI/animations';
 
 export const Footer = styled.footer`
   grid-area: footer;
   grid-column: 1/-1;
-  justify-self: center;
   top: 8px;
-  display: block;
-  z-index: 1;
+  display: flex;
+  flex-direction: column;
   background: #00000050;
-
   align-items: center;
 `;
 
 export const Logo = styled.div`
   ${({ theme }) => css`
     position: relative;
-    display: flex;
+    display: inline-flexbox;
     gap: 1rem;
     align-items: center;
     margin-right: ${theme.spacings.xlarge};
diff --git a/src/styles/global.tsx b/src/styles/global.tsx
index 48583c0..a8d63db 100644
--- a/src/styles/global.tsx
+++ b/src/styles/global.tsx
@@ -32,6 +32,7 @@ const GlobalStyle = createGlobalStyle`
     dl,
     dd {
       margin: 0;
+      margin: 0;
     }
 
     /* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */