Compare commits

..

1 Commits

Author SHA1 Message Date
NinjaHeaven 969028a536 First Commit 2020-01-13 23:51:54 +01:00
27 changed files with 85 additions and 272 deletions

View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1" /> <meta name="viewport" content="initial-scale=1" />
<title>LORD//CHANNEL</title> <title>LORDNABBO</title>
</head> </head>
<body style="background-color: #343a40;"> <body style="background-color: #343a40;">
<div id="root"></div> <div id="root"></div>

14
src/About.js Normal file
View File

@ -0,0 +1,14 @@
import React from 'react';
import Navbar from './Navbar';
class About extends React.Component {
render() {
return (
<>
<Navbar brand="LORDNABBO" />
</>
);
}
}
export default About;

View File

@ -1,41 +1,21 @@
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'; import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import React, { Suspense, lazy } from 'react'; import React, { Suspense, lazy } from 'react';
import Loading from "./routes/Loading";
//const Home = lazy(() => import('./routes/Home')); const Home = lazy(() => import('./Home'));
const Home = lazy(() => { const About = lazy(() => import('./About'));
return new Promise(resolve => { const Notfound = lazy(() => import('./notfound'));
setTimeout(() => resolve(import("./routes/Home")), 500);
});
});
const Film = lazy(() => import('./routes/Film'));
const Anime = lazy(() => import('./routes/Anime'));
const SerieTV = lazy(() => import('./routes/SerieTV'));
const Immagini = lazy(() => import('./routes/Immagini'));
const Musica = lazy(() => import('./routes/Musica'));
const Giochi = lazy(() => import('./routes/Giochi'));
const Programmi = lazy(() => import('./routes/Programmi'));
const Pannocchiacattiva = lazy(() => import('./routes/Pannocchiacattiva'))
const NotFound = lazy(() => import('./routes/NotFound'));
class App extends React.Component { class App extends React.Component {
render() { render() {
return ( return (
<Router> <Router>
<Suspense fallback={<Loading />}> <Suspense fallback={<div>Loading...</div>}>
<Switch> <Switch>
<Route exact path="/" component={Home}/> <Route exact path="/" component={Home}/>
<Route path="/Film" component={Film}/> <Route path="/About" component={About}/>
<Route path="/Anime" component={Anime}/>
<Route path="/SerieTV" component={SerieTV}/>
<Route path="/Immagini" component={Immagini}/>
<Route path="/Musica" component={Musica}/>
<Route path="/Giochi" component={Giochi}/>
<Route path="/Programmi" component={Programmi}/>
<Route path="/Pannocchiacattiva" component={Pannocchiacattiva}/>
<Route component={NotFound} /> <Route component={Notfound} />
</Switch> </Switch>
</Suspense> </Suspense>
</Router> </Router>

View File

@ -1,17 +1,23 @@
import React from 'react'; import React from 'react'
import {Link} from 'react-router-dom'; import {Link} from 'react-router-dom'
import 'bootstrap/dist/css/bootstrap.min.css'; import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js'; import 'bootstrap/dist/js/bootstrap.min.js';
import './Buttons.css'; import './Buttons.css';
class NavButton extends React.Component { export default class NavButton extends React.Component {
render() { render() {
return ( return (
<li className="nav-item"> <li className="nav-item">
<Link to={this.props.lhref}><button className="btn1">{this.props.name}</button></Link> <Button name={this.props.name} />
</li> </li>
); );
} }
} }
export default NavButton; export class Button extends React.Component {
render() {
return (
<button className="btn1" type="button"><Link to="/About">{this.props.name}</Link></button>
);
}
}

BIN
src/Error.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 243 KiB

BIN
src/Error.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 243 KiB

View File

@ -1,13 +1,13 @@
import React from 'react'; import React from 'react';
import Navbar from '../Navbar'; import Navbar from './Navbar';
import Parallax from '../Parallax'; import Parallax from './Parallax';
import CardContainer from '../CardContainer'; import CardContainer from './CardContainer';
class Home extends React.Component { class Home extends React.Component {
render() { render() {
return ( return (
<> <>
<Navbar brand="CHANNEL" /> <Navbar brand="LORDNABBO" />
<Parallax /> <Parallax />
<CardContainer sectionTitle="Latest Uploads" /> <CardContainer sectionTitle="Latest Uploads" />
<CardContainer sectionTitle="Random" /> <CardContainer sectionTitle="Random" />

View File

@ -1,4 +1,4 @@
.VideoPlayer { .videoPlayer {
width: 100%; width: 100%;
height: 250px; height: 250px;
background-color: black; background-color: black;

View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import 'bootstrap/dist/css/bootstrap.min.css'; import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js'; import 'bootstrap/dist/js/bootstrap.min.js';
import Button from 'react-bootstrap/Button'; import Button from './Buttons';
import Modal from 'react-bootstrap/Modal'; import Modal from 'react-bootstrap/Modal';
import './Buttons.css'; import './Buttons.css';
import './ModalButton.css'; import './ModalButton.css';
@ -11,17 +11,16 @@ function ModalButton() {
const handleClose = () => setShow(false); const handleClose = () => setShow(false);
const handleShow = () => setShow(true); const handleShow = () => setShow(true);
return ( return (
<> <>
<Button className="btn1" onClick={handleShow} lhref="#">View</Button> <Button className="btn1" name="view" onClick={handleShow} />
<Modal show={show} onHide={handleClose}> <Modal show={show} onHide={handleClose}>
<Modal.Header closeButton> <Modal.Header closeButton>
<Modal.Title>Card Title</Modal.Title> <Modal.Title>Card Title</Modal.Title>
</Modal.Header> </Modal.Header>
<Modal.Body> <Modal.Body>
<div className="VideoPlayer"></div> <VideoPlayer />
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title and make up the bulk of the card's content.
</Modal.Body> </Modal.Body>
</Modal> </Modal>
@ -29,4 +28,12 @@ function ModalButton() {
); );
} }
class VideoPlayer extends React.Component {
render() {
return (
<div className="videoPlayer"></div>
);
}
}
export default ModalButton; export default ModalButton;

View File

@ -1,5 +1,4 @@
import React from 'react'; import React from 'react';
import {Link} from 'react-router-dom';
import NavButton from './Buttons'; import NavButton from './Buttons';
import 'bootstrap/dist/css/bootstrap.min.css'; import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js'; import 'bootstrap/dist/js/bootstrap.min.js';
@ -9,23 +8,20 @@ class Navbar extends React.Component {
render() { render() {
return ( return (
<nav className="navbar navbar-expand-lg navbar-dark bg-dark"> <nav className="navbar navbar-expand-lg navbar-dark bg-dark">
<Link to="/"><span className="navbar-brand">LORD//{this.props.brand}</span></Link> <span className="navbar-brand">{this.props.brand}</span>
<button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navButtons" aria-controls="navButtons" aria-expanded="false" aria-label="Toggle navigation"> <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> <span className="navbar-toggler-icon"></span>
</button> </button>
<div className="collapse navbar-collapse flex" id="navButtons"> <div className="collapse navbar-collapse flex" id="navButtons">
<ul className="navbar-nav nav-mod"> <ul className="navbar-nav nav-mod">
<NavButton name="Film" lhref="/Film" /> <NavButton name="Home" lhref="/" />
<NavButton name="Anime" lhref="/Anime" /> <NavButton name="Film" />
<NavButton name="Serie TV" lhref="/Serietv" /> <NavButton name="Series" />
<NavButton name="Immagini" lhref="/Immagini" /> <NavButton name="About" lhref="/About" />
<NavButton name="Musica" lhref="/Musica" />
<NavButton name="Giochi" lhref="/Giochi" />
<NavButton name="Programmi" lhref="/Programmi" />
</ul> </ul>
<form className="form-inline my-2 my-lg-0"> <form class="form-inline my-2 my-lg-0">
<input className="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" /> <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
<button className="btn1" type="submit">Search</button> <button class="btn1" type="submit">Search</button>
</form> </form>
</div> </div>
</nav> </nav>

7
src/NavbarError.css Normal file
View File

@ -0,0 +1,7 @@
.centered{
text-align: center;
}
.loli-not-found{
height: 300px;
width: 300px; /*modifica la dimensione dell'immagine come ritieni opportuno*/
}

22
src/notfound.js Normal file
View File

@ -0,0 +1,22 @@
import React from 'react';
import Navbar from './Navbar';
class NotFound extends React.Component { //non mi caricava l'immagine il server quindi non so se le modifiche che ho fatto funzionano sull'immagine spero di si
render() {
return (
<>
<Navbar brand="LORD//404" />
<div class="container">
<h1 class="header">
SwEMBRA CHwE QwUALCwOSA SwIA ANDwATO STwORTwO NYAN! UwU
<div class="container centered loli-not-found">
<img src="Error.png" alt="ragazza anime molto carina"></img>
</div>
</h1>
</div>
</>
);
}
}
export default NotFound;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class Anime extends React.Component {
render() {
return (
<>
<Navbar brand="ANIME" />
</>
);
}
}
export default Anime;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class Film extends React.Component {
render() {
return (
<>
<Navbar brand="FILM" />
</>
);
}
}
export default Film;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class Giochi extends React.Component {
render() {
return (
<>
<Navbar brand="GIOCHI" />
</>
);
}
}
export default Giochi;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class Immagini extends React.Component {
render() {
return (
<>
<Navbar brand="IMMAGINI" />
</>
);
}
}
export default Immagini;

View File

@ -1,38 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js';
import "./centercontainer.css";
import loading1 from "./loadinggifs/loading1.gif";
import loading2 from "./loadinggifs/loading2.gif";
import loading3 from "./loadinggifs/loading3.gif";
import loading4 from "./loadinggifs/loading4.gif";
class Loading extends React.Component {
render() {
let randInt = () => {
return Math.round(Math.random() * 4);
};
let randomGif = () => {
let images = [loading1, loading2, loading3, loading4]
return images[randInt()];
};
console.log(randomGif())
return (
<>
<Navbar brand="LOADING" />
<div className="centered">
<div className="row">
<img alt="Loading..." src={randomGif()} />
</div>
</div>
</>
);
}
}
export default Loading;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class Musica extends React.Component {
render() {
return (
<>
<Navbar brand="MUSICA" />
</>
);
}
}
export default Musica;

View File

@ -1,22 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js';
import "./centercontainer.css"
class NotFound extends React.Component {
render() {
return (
<>
<Navbar brand="404" />
<div className="centered">
<div className="row">
<img alt="Loading..." src="https://i.pinimg.com/originals/8f/c3/21/8fc32146cbf72ae17430e05ecc8b61be.gif" />
</div>
</div>
</>
);
}
}
export default NotFound;

View File

@ -1,46 +0,0 @@
import React from 'react';
import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.min.js';
import Form from 'react-bootstrap/Form';
import Col from 'react-bootstrap/Col';
import '../Buttons.css';
import Navbar from '../Navbar';
class Pannocchiacattiva extends React.Component {
render() {
const shiroTexto = {
color: 'white'
}
return (
<>
<Navbar brand="PANNOCCHIA" />
<div className="centered" style={shiroTexto}>
<Form>
<Form.Group controlId="exampleForm.ControlInput1">
<Form.Control type="text" placeholder="Titolo Anime" />
</Form.Group>
<Form.Group controlId="exampleForm.ControlTextarea1">
<Form.Control type="text" placeholder="Trama" as="textarea" rows="3" />
</Form.Group>
<Form.Row>
<Form.Group as={Col} controlId="formGridCity">
<Form.Control type="text" placeholder="Durata" />
</Form.Group>
<Form.Group as={Col} controlId="formGridState">
<Form.Control type="text" placeholder="Voto" />
</Form.Group>
<Form.Group as={Col} controlId="formGridZip">
<Form.Control type="text" placeholder="Lingua" />
</Form.Group>
</Form.Row>
<button className="btn1">Submit</button>
</Form>
</div>
</>
);
}
}
export default Pannocchiacattiva;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class Programmi extends React.Component {
render() {
return (
<>
<Navbar brand="PROGRAMMI" />
</>
);
}
}
export default Programmi;

View File

@ -1,14 +0,0 @@
import React from 'react';
import Navbar from '../Navbar';
class SerieTV extends React.Component {
render() {
return (
<>
<Navbar brand="SERIETV" />
</>
);
}
}
export default SerieTV;

View File

@ -1,15 +0,0 @@
.centered {
height: 93vh;
display: flex;
align-items: center;
justify-content: center;
}
.row {
width: auto;
}
img {
height: 30vh;
width: auto;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 165 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 679 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 117 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 268 KiB