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…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user