diff --git a/src/components/GitHubLoginButton.tsx b/src/components/GitHubLoginButton.tsx
new file mode 100644
index 0000000..0bcefe9
--- /dev/null
+++ b/src/components/GitHubLoginButton.tsx
@@ -0,0 +1,35 @@
+import { type FC } from "react"
+import GitHubMarkWhiteImage from "../images/github-mark-white.png"
+import { LinkButton } from "codeforlife/components/router"
+
+export interface GitHubLoginButtonProps {}
+
+const GitHubLoginButton: FC<GitHubLoginButtonProps> = () => {
+  return (
+    <LinkButton
+      to="https://github.com/login/oauth/authorize?client_id=Ov23liBErSabQFqROeMg"
+      target="_blank"
+      style={{
+        marginTop: "200px",
+        borderRadius: "5px",
+        padding: "30px 40px",
+        fontSize: "20px",
+        background: "#000000",
+        color: "#FFFFFF",
+        display: "flex",
+        alignItems: "center",
+      }}
+      startIcon={
+        <img
+          src={GitHubMarkWhiteImage}
+          alt="GitHub Logo"
+          style={{ width: "40px", marginRight: "20px" }}
+        />
+      }
+    >
+      Log in with GitHub
+    </LinkButton>
+  )
+}
+
+export default GitHubLoginButton
diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx
index 0aa2c71..ab0c687 100644
--- a/src/pages/home/Home.tsx
+++ b/src/pages/home/Home.tsx
@@ -21,8 +21,6 @@ const Home: FC<HomeProps> = () => {
         </Typography>
         <Link to={paths.contributors._}>Contributors list </Link>
         <br></br>
-        <Link to={paths.agreementSignatures._}> Agreement signatures list</Link>
-        <br></br>
         <Link to={paths.login._}> Login with github</Link>
       </pages.Section>
     </pages.Page>
diff --git a/src/pages/login/GitHub.tsx b/src/pages/login/GitHub.tsx
index 7ed2e95..bbc34a2 100644
--- a/src/pages/login/GitHub.tsx
+++ b/src/pages/login/GitHub.tsx
@@ -1,8 +1,7 @@
 import * as pages from "codeforlife/components/page"
 import { type FC, useEffect } from "react"
-import Button from "@mui/material/Button"
 import CflLogoImage from "../../images/cfl_logo.png"
-import GitHubMarkWhiteImage from "../../images/github-mark-white.png"
+import GitHubLoginButton from "../../components/GitHubLoginButton"
 import { Image } from "codeforlife/components"
 import { useLoginWithGitHubMutation } from "../../api/session"
 
@@ -11,10 +10,6 @@ export interface GitHubProps {}
 const GitHub: FC<GitHubProps> = () => {
   const [loginWithGitHub] = useLoginWithGitHubMutation()
 
-  const handleLogin = () => {
-    window.location.href = `https://github.com/login/oauth/authorize?client_id=Ov23liBErSabQFqROeMg`
-  }
-
   useEffect(() => {
     const urlParams = new URLSearchParams(window.location.search)
     const code = urlParams.get("code")
@@ -22,12 +17,14 @@ const GitHub: FC<GitHubProps> = () => {
     if (code) {
       urlParams.delete("code")
       window.history.replaceState(null, "", window.location.pathname)
+
       loginWithGitHub({ code })
         .unwrap()
         .then(() => {
           window.location.href = "/agreement-signatures"
         })
         .catch(err => {
+          window.location.href = "/login"
           alert(`Login failed: ${err}`)
         })
     }
@@ -46,26 +43,7 @@ const GitHub: FC<GitHubProps> = () => {
           }}
         >
           <Image src={CflLogoImage} alt="code for life logo" maxWidth="200px" />
-          <Button
-            onClick={handleLogin}
-            style={{
-              marginTop: "200px",
-              borderRadius: "5px",
-              padding: "30px 40px",
-              fontSize: "20px",
-              background: "#000000",
-              color: "#FFFFFF",
-              display: "flex",
-              alignItems: "center",
-            }}
-          >
-            <img
-              src={GitHubMarkWhiteImage}
-              alt="GitHub Logo"
-              style={{ width: "40px", marginRight: "20px" }}
-            />
-            Log in with GitHub
-          </Button>
+          <GitHubLoginButton />
         </div>
       </pages.Section>
     </pages.Page>