From 22154d195317748132d58130817930245dfc6c1e Mon Sep 17 00:00:00 2001
From: enrico <enrico@fedora.windrunner.lan>
Date: Mon, 13 Jan 2020 21:48:51 +0100
Subject: [PATCH] FIX: routing, links, nav buttons, dynamic title

---
 public/index.html            |  2 +-
 src/About.js                 | 14 --------------
 src/App.js                   |  8 ++++----
 src/Buttons.js               | 16 +++++-----------
 src/Navbar.js                | 14 +++++++++-----
 src/routes/Anime.js          | 14 ++++++++++++++
 src/{ => routes}/Home.js     |  8 ++++----
 src/{ => routes}/notfound.js |  4 ++--
 8 files changed, 39 insertions(+), 41 deletions(-)
 delete mode 100644 src/About.js
 create mode 100644 src/routes/Anime.js
 rename src/{ => routes}/Home.js (66%)
 rename src/{ => routes}/notfound.js (74%)

diff --git a/public/index.html b/public/index.html
index 7bc5891..53db64e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -3,7 +3,7 @@
     <head>
         <meta charset="utf-8" />
         <meta name="viewport" content="initial-scale=1" />
-        <title>LORDNABBO</title>
+        <title>LORD//CHANNEL</title>
     </head>
     <body style="background-color: #343a40;">
         <div id="root"></div>
diff --git a/src/About.js b/src/About.js
deleted file mode 100644
index 37f3c25..0000000
--- a/src/About.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from './Navbar';
-
-class About extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="LORDNABBO" />
-            </>
-        );
-    }
-}
-
-export default About;
diff --git a/src/App.js b/src/App.js
index a2dd8e8..24a3888 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,9 +1,9 @@
 import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
 import React, { Suspense, lazy } from 'react';
 
-const Home = lazy(() => import('./Home'));
-const About = lazy(() => import('./About'));
-const Notfound = lazy(() => import('./notfound'));
+const Home = lazy(() => import('./routes/Home'));
+const Anime = lazy(() => import('./routes/Anime'));
+const Notfound = lazy(() => import('./routes/notfound'));
 
 
 class App extends React.Component {
@@ -13,7 +13,7 @@ class App extends React.Component {
                 <Suspense fallback={<div>Loading...</div>}>
                     <Switch>
                         <Route exact path="/" component={Home}/>
-                        <Route path="/About" component={About}/>
+                        <Route path="/Anime" component={Anime}/>
 
                         <Route component={Notfound} />
                     </Switch>
diff --git a/src/Buttons.js b/src/Buttons.js
index b2d120f..a849f61 100644
--- a/src/Buttons.js
+++ b/src/Buttons.js
@@ -1,23 +1,17 @@
-import React from 'react'
-import {Link} from 'react-router-dom'
+import React from 'react';
+import {Link} from 'react-router-dom';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap/dist/js/bootstrap.min.js';
 import './Buttons.css';
 
-export default class NavButton extends React.Component {
+class NavButton extends React.Component {
     render() {
         return (
         <li className="nav-item">
-            <Button name={this.props.name} />
+            <Link to={this.props.lhref}><button className="btn1">{this.props.name}</button></Link>
         </li>
         );
     }
 }
 
-export class Button extends React.Component {
-    render() {
-        return (
-        <button className="btn1" type="button"><Link to="/About">{this.props.name}</Link></button>
-        );
-    }
-}
+export default NavButton;
diff --git a/src/Navbar.js b/src/Navbar.js
index b18fec9..4e89d74 100644
--- a/src/Navbar.js
+++ b/src/Navbar.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import {Link} from 'react-router-dom';
 import NavButton from './Buttons';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap/dist/js/bootstrap.min.js';
@@ -8,16 +9,19 @@ class Navbar extends React.Component {
     render() {
         return (
         <nav className="navbar navbar-expand-lg navbar-dark bg-dark">
-            <span className="navbar-brand">{this.props.brand}</span>
+            <Link to="/"><span className="navbar-brand">LORD//{this.props.brand}</span></Link>
             <button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navButtons" aria-controls="navButtons" aria-expanded="false" aria-label="Toggle navigation">
                 <span className="navbar-toggler-icon"></span>
             </button>
             <div className="collapse navbar-collapse flex" id="navButtons">
                 <ul className="navbar-nav nav-mod">
-                    <NavButton name="Home" lhref="/" />
-                    <NavButton name="Film" />
-                    <NavButton name="Series" />
-                    <NavButton name="About" lhref="/About" />
+                    <NavButton name="Film" lhref="/Film" />
+                    <NavButton name="Anime" lhref="/Anime" />
+                    <NavButton name="Serie TV" lhref="/Serietv" />
+                    <NavButton name="Immagini" lhref="/Immagini" />
+                    <NavButton name="Musica" lhref="/Musica" />
+                    <NavButton name="Giochi" lhref="/Giochi" />
+                    <NavButton name="Programmi" lhref="/Programmi" />
                 </ul>
                 <form class="form-inline my-2 my-lg-0">
                     <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
diff --git a/src/routes/Anime.js b/src/routes/Anime.js
new file mode 100644
index 0000000..7b07812
--- /dev/null
+++ b/src/routes/Anime.js
@@ -0,0 +1,14 @@
+import React from 'react';
+import Navbar from '../Navbar';
+
+class Anime extends React.Component {
+    render() {
+        return (
+            <>
+                <Navbar brand="ANIME" />
+            </>
+        );
+    }
+}
+
+export default Anime;
diff --git a/src/Home.js b/src/routes/Home.js
similarity index 66%
rename from src/Home.js
rename to src/routes/Home.js
index b99a5c5..674a284 100644
--- a/src/Home.js
+++ b/src/routes/Home.js
@@ -1,13 +1,13 @@
 import React from 'react';
-import Navbar from './Navbar';
-import Parallax from './Parallax';
-import CardContainer from './CardContainer';
+import Navbar from '../Navbar';
+import Parallax from '../Parallax';
+import CardContainer from '../CardContainer';
 
 class Home extends React.Component {
     render() {
         return (
             <>
-                <Navbar brand="LORDNABBO" />
+                <Navbar brand="CHANNEL" />
                 <Parallax />
                 <CardContainer sectionTitle="Latest Uploads" />
                 <CardContainer sectionTitle="Random" />
diff --git a/src/notfound.js b/src/routes/notfound.js
similarity index 74%
rename from src/notfound.js
rename to src/routes/notfound.js
index 6c325fd..b65408f 100644
--- a/src/notfound.js
+++ b/src/routes/notfound.js
@@ -1,11 +1,11 @@
 import React from 'react';
-import Navbar from './Navbar';
+import Navbar from '../Navbar';
 
 class NotFound extends React.Component {
     render() {
         return (
             <>
-                <Navbar brand="LORDNABBO" />
+                <Navbar brand="404" />
                 <div><h1>I MEME 404</h1></div>
             </>
         );