From cdf655f869bd0993b52f4268f058571740b1cf4d Mon Sep 17 00:00:00 2001
From: Lena <lena.becker-3@mni.thm.de>
Date: Sun, 28 Feb 2021 02:58:53 +0100
Subject: Add 404 page #10

---
 webui/src/pages/notfound/NotFoundPage.tsx | 37 +++++++++++++++++++++++++++++++
 1 file changed, 37 insertions(+)
 create mode 100644 webui/src/pages/notfound/NotFoundPage.tsx

(limited to 'webui/src/pages/notfound/NotFoundPage.tsx')

diff --git a/webui/src/pages/notfound/NotFoundPage.tsx b/webui/src/pages/notfound/NotFoundPage.tsx
new file mode 100644
index 00000000..ae84ac3e
--- /dev/null
+++ b/webui/src/pages/notfound/NotFoundPage.tsx
@@ -0,0 +1,37 @@
+import React from 'react';
+
+import { makeStyles } from '@material-ui/core/styles';
+
+const useStyles = makeStyles((theme) => ({
+  main: {
+    maxWidth: 1000,
+    margin: 'auto',
+    marginTop: theme.spacing(20),
+  },
+  logo: {
+    height: '350px',
+  },
+  container: {
+    display: 'flex',
+    alignItems: 'center',
+  },
+}));
+
+function NotFoundPage() {
+  const classes = useStyles();
+  return (
+    <main className={classes.main}>
+      <div className={classes.container}>
+        <h1>404 – Page not found</h1>
+        <img
+          src="/logo-alpha-flat-outline.svg"
+          className={classes.logo}
+          alt="git-bug"
+        />
+        <h1>Go back to start page</h1>
+      </div>
+    </main>
+  );
+}
+
+export default NotFoundPage;
-- 
cgit 


From 4dcc6f67b37bf756c7afb7e40f700a838906113b Mon Sep 17 00:00:00 2001
From: Lena <lena.becker-3@mni.thm.de>
Date: Sun, 28 Feb 2021 04:15:21 +0100
Subject: Add backlink to 404 page #10

---
 webui/src/pages/notfound/NotFoundPage.tsx | 42 +++++++++++++++++++++----------
 1 file changed, 29 insertions(+), 13 deletions(-)

(limited to 'webui/src/pages/notfound/NotFoundPage.tsx')

diff --git a/webui/src/pages/notfound/NotFoundPage.tsx b/webui/src/pages/notfound/NotFoundPage.tsx
index ae84ac3e..2aba9cef 100644
--- a/webui/src/pages/notfound/NotFoundPage.tsx
+++ b/webui/src/pages/notfound/NotFoundPage.tsx
@@ -1,19 +1,34 @@
+import wrap from '@arrows/composition/internal/wrap';
 import React from 'react';
 
 import { makeStyles } from '@material-ui/core/styles';
+import ArrowBackIcon from '@material-ui/icons/ArrowBack';
 
 const useStyles = makeStyles((theme) => ({
   main: {
     maxWidth: 1000,
     margin: 'auto',
-    marginTop: theme.spacing(20),
+    marginTop: theme.spacing(10),
   },
   logo: {
     height: '350px',
+    display: 'block',
+    marginLeft: 'auto',
+    marginRight: 'auto',
   },
-  container: {
-    display: 'flex',
-    alignItems: 'center',
+  icon: {
+    display: 'block',
+    marginLeft: 'auto',
+    marginRight: 'auto',
+    fontSize: '80px',
+  },
+  backLink: {
+    textDecoration: 'none',
+    color: theme.palette.text.primary,
+  },
+  header: {
+    fontSize: '30px',
+    textAlign: 'center',
   },
 }));
 
@@ -21,15 +36,16 @@ function NotFoundPage() {
   const classes = useStyles();
   return (
     <main className={classes.main}>
-      <div className={classes.container}>
-        <h1>404 – Page not found</h1>
-        <img
-          src="/logo-alpha-flat-outline.svg"
-          className={classes.logo}
-          alt="git-bug"
-        />
-        <h1>Go back to start page</h1>
-      </div>
+      <h1 className={classes.header}>404 – Page not found</h1>
+      <img
+        src="/logo-alpha-flat-outline.svg"
+        className={classes.logo}
+        alt="git-bug"
+      />
+      <a href="/" className={classes.backLink}>
+        <h2 className={classes.header}>Go back to start page</h2>
+        <ArrowBackIcon className={classes.icon} />
+      </a>
     </main>
   );
 }
-- 
cgit 


From 16b176f9bf40a5fd6fb832f8858ec389826752a5 Mon Sep 17 00:00:00 2001
From: Lena <lena.becker-3@mni.thm.de>
Date: Sun, 28 Feb 2021 20:54:17 +0100
Subject: Make backbutton sticky #10

---
 webui/src/pages/notfound/NotFoundPage.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'webui/src/pages/notfound/NotFoundPage.tsx')

diff --git a/webui/src/pages/notfound/NotFoundPage.tsx b/webui/src/pages/notfound/NotFoundPage.tsx
index 2aba9cef..57b186c5 100644
--- a/webui/src/pages/notfound/NotFoundPage.tsx
+++ b/webui/src/pages/notfound/NotFoundPage.tsx
@@ -1,4 +1,3 @@
-import wrap from '@arrows/composition/internal/wrap';
 import React from 'react';
 
 import { makeStyles } from '@material-ui/core/styles';
@@ -40,7 +39,7 @@ function NotFoundPage() {
       <img
         src="/logo-alpha-flat-outline.svg"
         className={classes.logo}
-        alt="git-bug"
+        alt="git-bug Logo"
       />
       <a href="/" className={classes.backLink}>
         <h2 className={classes.header}>Go back to start page</h2>
-- 
cgit 


From 833f020a9b97656941434a5e9bc5248ee0caeb76 Mon Sep 17 00:00:00 2001
From: Sascha <GlancingMind@outlook.com>
Date: Mon, 15 Mar 2021 16:09:40 +0100
Subject: Use BackToList button on 404-Page

---
 webui/src/pages/notfound/NotFoundPage.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

(limited to 'webui/src/pages/notfound/NotFoundPage.tsx')

diff --git a/webui/src/pages/notfound/NotFoundPage.tsx b/webui/src/pages/notfound/NotFoundPage.tsx
index 57b186c5..2c6f6854 100644
--- a/webui/src/pages/notfound/NotFoundPage.tsx
+++ b/webui/src/pages/notfound/NotFoundPage.tsx
@@ -1,7 +1,8 @@
 import React from 'react';
 
 import { makeStyles } from '@material-ui/core/styles';
-import ArrowBackIcon from '@material-ui/icons/ArrowBack';
+
+import BackToListButton from '../../components/BackToListButton';
 
 const useStyles = makeStyles((theme) => ({
   main: {
@@ -22,8 +23,8 @@ const useStyles = makeStyles((theme) => ({
     fontSize: '80px',
   },
   backLink: {
-    textDecoration: 'none',
-    color: theme.palette.text.primary,
+    marginTop: theme.spacing(1),
+    textAlign: 'center',
   },
   header: {
     fontSize: '30px',
@@ -41,10 +42,9 @@ function NotFoundPage() {
         className={classes.logo}
         alt="git-bug Logo"
       />
-      <a href="/" className={classes.backLink}>
-        <h2 className={classes.header}>Go back to start page</h2>
-        <ArrowBackIcon className={classes.icon} />
-      </a>
+      <div className={classes.backLink}>
+        <BackToListButton />
+      </div>
     </main>
   );
 }
-- 
cgit 

