From 5a62ee43c0e320a988e8ec7dc34028c86123d8a4 Mon Sep 17 00:00:00 2001
From: timka <git@timka.su>
Date: Thu, 23 Nov 2023 17:57:46 +0300
Subject: [PATCH] add styles to 404 and fix margin bottom

---
 src/App.css                | 31 ++++++++++++++++++++++++++-----
 src/App.js                 |  2 ++
 src/components/AddLink.js  |  1 -
 src/components/NotFound.js |  7 ++++++-
 4 files changed, 34 insertions(+), 7 deletions(-)

diff --git a/src/App.css b/src/App.css
index beb8521..e7b670c 100644
--- a/src/App.css
+++ b/src/App.css
@@ -27,18 +27,18 @@ body {
   width: 300px;
   height: 30px;
   padding: 0.2em 0.5em;
-  font-family: JetBrainsItalic;
+  font-family: JetBrainsItalic, monospace;
   border-radius: 15px;
 }
 
 .title {
   color: #FFFFFF;
   font-size: xxx-large;
-  font-family: JetBrainsItalic;
+  font-family: JetBrainsItalic, monospace;
 }
 
 h1, h2 {
-  font-family: mono;
+  font-family: mono, monospace;
 }
 
 .shortButton {
@@ -47,10 +47,31 @@ h1, h2 {
   background-color: #322C77;
   color: antiquewhite;
   border: #322C77;
-  border-radius: 5%;
   font-size: medium;
   margin-left: 15px;
   margin-top: 30px;
-  font-family: JetBrainsItalic;
+  font-family: JetBrainsItalic, monospace;
   border-radius: 25px;
+  margin-bottom: 200px;
+}
+
+.notFound {
+  margin-top: 200px;
+  color: #FFFFFF;
+}
+
+.title {
+  margin-top: 200px;
+}
+
+.small-text {
+  color: #FFFFFF;
+  margin-top: 100px;
+  font-family: JetBrainsItalic, monospace;
+  margin-bottom: 150px;
+}
+
+.href {
+  color: #FFFFFF;
+  text-decoration: none;
 }
diff --git a/src/App.js b/src/App.js
index 01b7e21..98ffcff 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,10 +4,12 @@ import {BrowserRouter, Routes, Route} from "react-router-dom";
 import AddLink from "./components/AddLink";
 import Redirecter from './components/Redirecter'
 import NotFound from './components/NotFound'
+import {React} from "react";
 
 function App() {
   return (
       <div className="App">
+          <h3 className="title"><a href="/" className="href">Timka ShortLink</a></h3>
           <BrowserRouter>
               <Routes>
                   <Route path="add" element={<AddLink/>} />
diff --git a/src/components/AddLink.js b/src/components/AddLink.js
index c07da4c..8df438e 100644
--- a/src/components/AddLink.js
+++ b/src/components/AddLink.js
@@ -37,7 +37,6 @@ class AddLink extends Component {
 
     render () {
         return <div className="addForm">
-            <h3 className="title">Timka ShortLink</h3>
             <div className="form">
                 <input
                     name="link"
diff --git a/src/components/NotFound.js b/src/components/NotFound.js
index e2dd817..5185c91 100644
--- a/src/components/NotFound.js
+++ b/src/components/NotFound.js
@@ -1,9 +1,14 @@
 import {React, Component} from "react";
+import "../App.css"
 
 
 class NotFound extends Component {
     render () {
-        return <h2>Not found</h2>
+        return <div>
+            <h2 className="notFound">Not found or deleted.</h2>
+
+            <p className="small-text">Short any link with <a href="/" className="href">Timka ShortLink</a></p>
+        </div>
         // todo add design
     }
 }