Link Header to homepage

2 files changed, 15 insertions, 6 deletions

diff --git a/thallium-frontend/src/App.tsx b/thallium-frontend/src/App.tsx
index ec54c17..0223c46 100644
--- a/thallium-frontend/src/App.tsx
+++ b/thallium-frontend/src/App.tsx
@@ -26,14 +26,14 @@ const GlobalStyle = createGlobalStyle`
     height: 100%;
   }
 
-  a {
+  a:not(.Header-bar) {
     color: ${({ theme }) => theme.linkColor};
     text-decoration: none;
     transition: border-bottom 0.2s;
     border-bottom: 1px dotted transparent;
   }
 
-  a:hover {
+  a:not(.Header-bar):hover {
     border-bottom: 1px dotted ${({ theme }) => theme.linkColor};
   }
 `;
diff --git a/thallium-frontend/src/components/Header.tsx b/thallium-frontend/src/components/Header.tsx
index bd288ac..c55a3d2 100644
--- a/thallium-frontend/src/components/Header.tsx
+++ b/thallium-frontend/src/components/Header.tsx
@@ -18,14 +18,23 @@ const HeaderContainer = styled.header`
   }
 `;
 
+const NoStyleLink = styled.a`
+  color: inherit;
+  text-decoration: none;
+  display: flex;
+  align-items: center;
+`;
 
 const Header = () => {
   return (
     <HeaderContainer>
-      <img src="icon.svg" alt="Thallium logo" />
-      <h1>
-        Thallium
-      </h1>
+      {/* FIXME: Try get this to use React router somehow for SPA routing */}
+      <NoStyleLink className="Header-bar" href="/">
+        <img src="icon.svg" alt="Thallium logo" />
+        <h1>
+          Thallium
+        </h1>
+      </NoStyleLink>
     </HeaderContainer>
   );
 };