render() { return ( <div> <Navbar bg="light" expand="lg"> <Navbar.Brand>React Bootstrap Example</Navbar.Brand> </Navbar> </div> ) }
renderUserProfileModal() { return ( <Modal show={this.state.showModal} onHide={this.handleClose}> <Modal.Header closeButton> </Modal.Header> <Modal.Body> <UserProfile user={this.props.user} /> </Modal.Body> </Modal> ) }
const CourseDetails = (props) => { return ( <Tab.Pane key="0" eventKey={"#" + props.id}> <h4>{props.title}</h4> <br/> <small>{(typeof props.author !== 'undefined') ? <p className="small mb-1">{props.author.name}</p> : ''}</small> <p>{props.description}</p> </Tab.Pane> ); }
render() { return ( <Card className="text-center"> <h3 >Counter</h3> <h4>Component using Redux</h4> <Card.Body> <button className="btn btn-success" onClick={this.decrement}>-</button> <span>{this.props.count}</span> <button className="btn btn-success" onClick={this.increment}>+</button> <button className="btn btn-warning" onClick={this.reset}>R</button> </Card.Body> </Card> ) }
render() { return isAuthenticated() ? ( <Nav> <NavDropdown title='Welcome!' id='basic-nav-dropdown'> <NavDropdown.Item onClick={this.logout}>Logout</NavDropdown.Item> </NavDropdown> </Nav> ) : ( <Nav> <Link className='nav-link' to='/login'>Login</Link> </Nav> ); }
render() { return( <Navbar bg="light" > <Navbar.Brand href="/">React-Bootstrap & React Redux</Navbar.Brand> <Navbar.Toggle aria-controls="basic-navbar-nav" /> <Navbar.Collapse id="basic-navbar-nav"> <Nav className="mr-auto"> <Nav.Link href="#link">Link</Nav.Link> </Nav> </Navbar.Collapse> </Navbar> ) }
const NavigationBar = () => ( <Styles> <Navbar expand="lg"> <Navbar.Brand href="/">Shoreline IoT</Navbar.Brand> <Navbar.Toggle aria-controls="basic-navbar-nav"/> <Navbar.Collapse id="basic-navbar-nav"> <Nav className="ml-auto"> <Nav.Item><Nav.Link href="/">Notification</Nav.Link></Nav.Item> <Nav.Item><Nav.Link href="/organization">Quick Link</Nav.Link></Nav.Item> </Nav> </Navbar.Collapse> </Navbar> </Styles> )
const Component1 = () => { return ( <Card style={{ width: '18rem' }}> <Card.Img variant="top" src="../slike/slika_primjer1.jpg" /> <Card.Body> <Card.Title>Card Title</Card.Title> <Card.Text> Some quick example text to build on the card title and make up the bulk of the card's content. </Card.Text> <Button variant="primary">Go somewhere</Button> </Card.Body> </Card> ); }
render() { return ( <Navbar bg="dark" variant="dark" > <Navbar.Brand href="#home">Example React</Navbar.Brand> <Nav className="mr-auto"> <NavLink to="/" className="nav-link" activeStyle="active" exact>Home</NavLink> </Nav> </Navbar> ); }
renderUserProfileModal() { return ( <Modal show={this.state.showModal} onHide={this.handleClose}> <Modal.Header closeButton> </Modal.Header> <Modal.Body> <UserProfile user={this.props.user} /> </Modal.Body> </Modal> ) }
renderUserProfileModal() { return ( <Modal show={this.state.showModal} onHide={this.handleClose}> <Modal.Header closeButton> </Modal.Header> <Modal.Body> <UserProfile user={this.props.user} /> </Modal.Body> </Modal> ) }
render() { return ( <div> <Navbar bg='light' expand='lg'> <Navbar.Brand>React Redux Example</Navbar.Brand> </Navbar> </div> ) }