hugo bereit für plugzeuge

This commit is contained in:
Nilstrieb 2021-02-14 16:22:11 +01:00
parent 6b39d6b79a
commit fddfef5829
8 changed files with 39 additions and 29 deletions

View file

Before

Width:  |  Height:  |  Size: 271 KiB

After

Width:  |  Height:  |  Size: 271 KiB

Before After
Before After

View file

Before

Width:  |  Height:  |  Size: 492 KiB

After

Width:  |  Height:  |  Size: 492 KiB

Before After
Before After

View file

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

Before After
Before After

View file

@ -20,8 +20,7 @@ class App extends Component {
<main> <main>
<Route exact path="/" component={Home}/> <Route exact path="/" component={Home}/>
<Route exact path="/hugo" component={UeberHugo}/> <Route exact path="/hugo" component={UeberHugo}/>
<Route path="/militaer/modern" component={PlaneList}/> <Route path="/flugzeuge" component={PlaneList}/>
<Route path="/flugzeuge" component={Planes}/>
<Route path="/flugzeug" component={Planes}/> <Route path="/flugzeug" component={Planes}/>
</main> </main>
<Footer/> <Footer/>
@ -45,38 +44,38 @@ class Navigation extends Component {
<NavLink to="/hugo">Über Hugo</NavLink> <NavLink to="/hugo">Über Hugo</NavLink>
</li> </li>
<li> <li>
<NavLink to="/">Militärflugzeuge</NavLink> <NavLink to="/flugzeuge/militaer">Militärflugzeuge</NavLink>
<div className="content"> <div className="content">
<NavLink to="/">Erste Weltkrieg</NavLink> <NavLink to="/flugzeuge/militaer/erster_weltkrieg">Erste Weltkrieg</NavLink>
<NavLink to="/">Zwischenkriegszeit</NavLink> <NavLink to="/flugzeuge/militaer/zwischenkriegszeit">Zwischenkriegszeit</NavLink>
<NavLink to="/">Zweiter Weltkrieg</NavLink> <NavLink to="/flugzeuge/militaer/zweiter_weltkrieg">Zweiter Weltkrieg</NavLink>
<NavLink to="/">Kalter Krieg</NavLink> <NavLink to="/flugzeuge/militaer/kalter_krieg">Kalter Krieg</NavLink>
<NavLink to="/militaer/modern">Moderne</NavLink> <NavLink to="/flugzeuge/militaer/modern">Moderne</NavLink>
</div> </div>
</li> </li>
<li> <li>
<NavLink to="/">Airliner</NavLink> <NavLink to="/flugzeuge/airliner">Airliner</NavLink>
<div className="content"> <div className="content">
<NavLink to="/">Boeing</NavLink> <NavLink to="/flugzeuge/airliner/boeing">Boeing</NavLink>
<NavLink to="/">Airbus</NavLink> <NavLink to="/flugzeuge/airliner/airbus">Airbus</NavLink>
<NavLink to="/">Andere</NavLink> <NavLink to="/flugzeuge/airliner/andere">Andere</NavLink>
</div> </div>
</li> </li>
<li> <li>
<NavLink to="/">Sportflugzeuge</NavLink> <NavLink to="/flugzeuge/sport">Sportflugzeuge</NavLink>
<div className="content"> <div className="content">
<NavLink to="/">Doppeldecker</NavLink> <NavLink to="/flugzeuge/sport/doppeldecker">Doppeldecker</NavLink>
<NavLink to="/">Propellerflugzeuge</NavLink> <NavLink to="/flugzeuge/sport/propellerflugzeuge">Propellerflugzeuge</NavLink>
<NavLink to="/">Segelflugzeuge</NavLink> <NavLink to="/flugzeuge/sport/segelflugzeuge">Segelflugzeuge</NavLink>
<NavLink to="/">Andere</NavLink> <NavLink to="/flugzeuge/sport/andere">Andere</NavLink>
</div> </div>
</li> </li>
<li> <li>
<NavLink to="/">Spezielle</NavLink> <NavLink to="/flugzeuge/speziell">Spezielle</NavLink>
<div className="content"> <div className="content">
<NavLink to="/">Helikopter</NavLink> <NavLink to="/flugzeuge/spezielle/helikopter">Helikopter</NavLink>
<NavLink to="/">Zeppeline</NavLink> <NavLink to="/flugzeuge/spezielle/zeppeline">Zeppeline</NavLink>
<NavLink to="/">Andere</NavLink> <NavLink to="/flugzeuge/spezielle/andere">Andere</NavLink>
</div> </div>
</li> </li>
</ul> </ul>

View file

@ -13,7 +13,7 @@ class Home extends Component {
render() { render() {
const favs = this.state.favs const favs = this.state.favs
.map(x => <ModelImage src={x.category + x.img} name={x.name} cat={x.category}/>); .map(x => <ModelImage src={x.category + x.img} name={x.name} cat={x.category} key={x.category + x.name}/>);
return ( return (
<div> <div>

View file

@ -1,16 +1,27 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import ModelImage from './PlanePreview' import ModelImage from './PlanePreview'
import planes from './planes.json';
class PlaneList extends Component { class PlaneList extends Component {
render() { render() {
const items = Array(100).fill(1).map((x, y) => x + y) const loc = this.props.location.pathname;
.map(x => <ModelImage src="military/modern/f22.png" name={'F' + (20 + x) + ' Raptor'}/>); const cat = loc.replaceAll('/flugzeuge/', '') + '/';
let matches = [];
for (const e of planes) {
if (e.category.startsWith(cat)) {
matches.push(e);
}
}
matches = matches.map(x => <ModelImage src={x.category + x.img} name={x.name} cat={x.category} key={x.category + x.name}/>);
return ( return (
<div> <div>
{items} {matches}
<ModelImage src="harrier.jpg" name="AV-8B Harrier"/>
</div> </div>
) )
} }

View file

@ -10,7 +10,7 @@ class UeberHugo extends Component {
<p>Am liebsten baut er Flugzeuge, sie haben ihn schon sein ganzes Leben fasziniert und er wollte immer Pilot werden. <p>Am liebsten baut er Flugzeuge, sie haben ihn schon sein ganzes Leben fasziniert und er wollte immer Pilot werden.
Das hat er zwar nicht geschafft, aber das Modellbauen ermöglicht es ihm, seine Leidenschaft trotzdem auszuleben. Das hat er zwar nicht geschafft, aber das Modellbauen ermöglicht es ihm, seine Leidenschaft trotzdem auszuleben.
Auf dieser Website präsentiert Hugo seine liebsten Flugzeuge, die er am liebsten alle nachbauen würde.</p> Auf dieser Website präsentiert Hugo seine liebsten Flugzeuge, die er am liebsten alle nachbauen würde.</p>
<img src={process.env.PUBLIC_URL + '/img/hugo.jpg'} alt="Hugo Boss"/> <img src={process.env.PUBLIC_URL + '/img/hugo.jpg'} alt="Hugo Boss" width="1500px"/>
</div> </div>
) )
} }

View file

@ -2,7 +2,7 @@
{ {
"name": "F-22 Raptor", "name": "F-22 Raptor",
"img": "f22.png", "img": "f22.png",
"category": "military/modern/", "category": "militaer/modern/",
"description": "Die F-22 Raptor ist ein Kampfflugzeug der 6. Generation der USA. Durch seine moderne Computersteuerung und Tarnkappentechnik ist es der Herr der Lüfte", "description": "Die F-22 Raptor ist ein Kampfflugzeug der 6. Generation der USA. Durch seine moderne Computersteuerung und Tarnkappentechnik ist es der Herr der Lüfte",
"tags": [ "tags": [
"fav" "fav"
@ -11,7 +11,7 @@
{ {
"name": "AV-8B Harrier", "name": "AV-8B Harrier",
"img": "harrier.jpg", "img": "harrier.jpg",
"category": "military/cold_war/", "category": "militaer/kalter_krieg/",
"description": "Der Harrier ist ein Britisches Kampflugzeug. Er war der erste Jet (im aktiven Einsatz) mit der Fähigkeit, senkrecht wie ein Helikopter abzuheben und zu landen.", "description": "Der Harrier ist ein Britisches Kampflugzeug. Er war der erste Jet (im aktiven Einsatz) mit der Fähigkeit, senkrecht wie ein Helikopter abzuheben und zu landen.",
"tags": [ "tags": [
"fav" "fav"