Noratrieb/hugos-lieblingsflugzeuge
1
0
Fork 0
mirror of https://github.com/Noratrieb/hugos-lieblingsflugzeuge.git synced 2026-01-16 20:55:05 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

spa (mit hugo)

Browse source
This commit is contained in:
Nilstrieb 2021-02-13 17:24:18 +01:00
parent a395e0e8fb
commit 933ef702c6
8 changed files with 229 additions and 99 deletions
Download patch file Download diff file Expand all files Collapse all files

89
src/App.js Normal file
View file

@ -0,0 +1,89 @@
import React from 'react';
import {
Route, NavLink, HashRouter
} from 'react-router-dom'
import './app.css';
import './template.css'
import Modern from "./Militaer";
import Home from "./Home";
class App extends React.Component {
render() {
return (
<HashRouter>
<div id="parent">
<header>
<Navigation/>
<h1>Hugos Lieblingsflugzeuge</h1>
</header>
<main>
<Route exact path="/" component={Home}/>
<Route path="/flieger-modern" component={Modern}/>
</main>
<Footer/>
</div>
</HashRouter>
);
}
}
export default App;
class Navigation extends React.Component {
render() {
return (
<nav>
<ul>
<li>
<NavLink to="/">Start</NavLink>
</li>
<li>
<NavLink to="/">Militärflugzeuge</NavLink>
<div className="content">
<NavLink to="/">Erste Weltkrieg</NavLink>
<NavLink to="/">Zwischenkriegszeit</NavLink>
<NavLink to="/">Zweiter Weltkrieg</NavLink>
<NavLink to="/">Kalter Krieg</NavLink>
<NavLink to="/flieger-modern">Moderne</NavLink>
</div>
</li>
<li>
<NavLink to="/">Airliner</NavLink>
<div className="content">
<NavLink to="/">Boeing</NavLink>
<NavLink to="/">Airbus</NavLink>
<NavLink to="/">Andere</NavLink>
</div>
</li>
<li>
<NavLink to="/">Sportflugzeuge</NavLink>
<div className="content">
<NavLink to="/">Doppeldecker</NavLink>
<NavLink to="/">Propellerflugzeuge</NavLink>
<NavLink to="/">Segelflugzeuge</NavLink>
<NavLink to="/">Andere</NavLink>
</div>
</li>
<li>
<NavLink to="/">Spezielle</NavLink>
<div className="content">
<NavLink to="/">Helikopter</NavLink>
<NavLink to="/">Zeppeline</NavLink>
<NavLink to="/">Andere</NavLink>
</div>
</li>
</ul>
</nav>
)
}
}
class Footer extends React.Component {
render() {
return (
<footer>
<div>hi</div>
</footer>
)
}
}