From 15e901d2babc327ef75cbbacdaac64f5a1597f7d Mon Sep 17 00:00:00 2001
From: Francisco Pessano <franpessano1@gmail.com>
Date: Mon, 24 Jan 2022 16:13:22 -0300
Subject: [PATCH] Header done

---
 public/index.html                |  3 +++
 src/components/Header/Header.jsx | 23 +++++++++++++++++++++--
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/public/index.html b/public/index.html
index b7e6469..03127c2 100644
--- a/public/index.html
+++ b/public/index.html
@@ -24,6 +24,9 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Raleway:wght@700&display=swap" rel="stylesheet">
     <link
       rel="stylesheet"
       href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
diff --git a/src/components/Header/Header.jsx b/src/components/Header/Header.jsx
index a113dc0..c606c48 100644
--- a/src/components/Header/Header.jsx
+++ b/src/components/Header/Header.jsx
@@ -1,12 +1,31 @@
 import React from 'react';
+import styled from 'styled-components'
 
 const Header = () => {
 
+    const Header = styled.header`
+
+        display: flex;
+        justify-content: center;
+
+        padding: 3vh 0px;
+        
+        border-bottom: solid 2px #ffffff24;
+
+        user-select: none;
+        
+        h1 {
+
+            font-family: 'Raleway', sans-serif;
+            color: #fff;
+        }
+    `
+
     return (
     
-        <header>
+        <Header>
             <h1>Crypto Page</h1>
-        </header>
+        </Header>
     )
 };