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

image loading for hugos planes

Browse source
This commit is contained in:
Nilstrieb 2021-02-13 18:49:58 +01:00
parent 9bb74df734
commit 0d1cf198b3
3 changed files with 11 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/App.js
View file

@ -1,4 +1,4 @@
import React, {Component} from "react"; import React, {Component} from 'react';
import { import {
Route, NavLink, HashRouter Route, NavLink, HashRouter
} from 'react-router-dom' } from 'react-router-dom'
@ -17,7 +17,7 @@ class App extends Component {
</header> </header>
<main> <main>
<Route exact path="/" component={Home}/> <Route exact path="/" component={Home}/>
<Route path="/flieger-modern" component={Modern}/> <Route path="/militaer/modern" component={Modern}/>
</main> </main>
<Footer/> <Footer/>
</div> </div>
@ -43,7 +43,7 @@ class Navigation extends Component {
<NavLink to="/">Zwischenkriegszeit</NavLink> <NavLink to="/">Zwischenkriegszeit</NavLink>
<NavLink to="/">Zweiter Weltkrieg</NavLink> <NavLink to="/">Zweiter Weltkrieg</NavLink>
<NavLink to="/">Kalter Krieg</NavLink> <NavLink to="/">Kalter Krieg</NavLink>
<NavLink to="/flieger-modern">Moderne</NavLink> <NavLink to="/militaer/modern">Moderne</NavLink>
</div> </div>
</li> </li>
<li> <li>

4
src/Home.js
View file

@ -1,5 +1,5 @@
import React, {Component} from "react"; import React, {Component} from 'react';
import ModelImage from "./Plane"; import ModelImage from './Plane';
class Home extends Component { class Home extends Component {
render() { render() {

9
src/Plane.js
View file

@ -1,4 +1,7 @@
import React, {Component} from "react"; import React, {Component} from 'react';
import {
Route, NavLink, HashRouter
} from 'react-router-dom'
import './Plane.css' import './Plane.css'
@ -17,12 +20,12 @@ class ModelImage extends Component {
render() { render() {
return ( return (
<a href="" className="model"> <NavLink to={'/flugzeug/' + this.state.name} className="model">
<img src={process.env.PUBLIC_URL + '/img/' + this.state.src} alt={this.state.name}/> <img src={process.env.PUBLIC_URL + '/img/' + this.state.src} alt={this.state.name}/>
<div className="model-info"> <div className="model-info">
<span className="model-info-text">{this.state.name}</span> <span className="model-info-text">{this.state.name}</span>
</div> </div>
</a> </NavLink>
); );
} }
} }