Modal Fixed!!!
parent
edfbf242f0
commit
1a31ace453
|
@ -1,4 +1,4 @@
|
||||||
.videoPlayer {
|
.VideoPlayer {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 250px;
|
height: 250px;
|
||||||
background-color: black;
|
background-color: black;
|
||||||
|
|
|
@ -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 './Buttons';
|
import Button from 'react-bootstrap/Button';
|
||||||
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,16 +11,17 @@ function ModalButton() {
|
||||||
|
|
||||||
const handleClose = () => setShow(false);
|
const handleClose = () => setShow(false);
|
||||||
const handleShow = () => setShow(true);
|
const handleShow = () => setShow(true);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Button className="btn1" name="view" onClick={handleShow} />
|
<Button className="btn1" onClick={handleShow} lhref="#">View</Button>
|
||||||
|
|
||||||
<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>
|
||||||
<VideoPlayer />
|
<div className="VideoPlayer"></div>
|
||||||
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>
|
||||||
|
@ -28,12 +29,4 @@ function ModalButton() {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
class VideoPlayer extends React.Component {
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div className="videoPlayer"></div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default ModalButton;
|
export default ModalButton;
|
||||||
|
|
|
@ -23,9 +23,9 @@ class Navbar extends React.Component {
|
||||||
<NavButton name="Giochi" lhref="/Giochi" />
|
<NavButton name="Giochi" lhref="/Giochi" />
|
||||||
<NavButton name="Programmi" lhref="/Programmi" />
|
<NavButton name="Programmi" lhref="/Programmi" />
|
||||||
</ul>
|
</ul>
|
||||||
<form class="form-inline my-2 my-lg-0">
|
<form className="form-inline my-2 my-lg-0">
|
||||||
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
|
<input className="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
|
||||||
<button class="btn1" type="submit">Search</button>
|
<button className="btn1" type="submit">Search</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
Loading…
Reference in New Issue