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;