add styles to 404 and fix margin bottom
This commit is contained in:
parent
adae20b9ab
commit
5a62ee43c0
31
src/App.css
31
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;
|
||||
}
|
||||
|
@ -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/>} />
|
||||
|
@ -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"
|
||||
|
@ -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
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user