import React, {component} from 'react';
import { Icon, Button, Card, Row, Col , CardPanel} from 'react-materialize';

export class Bat extends React.Component{
	
	constructor(props){
		super(props);
		
	}
	render(){

		return(
			<div>
			 	<Row>
			 		<Col l={3} s={12} m={5}>
			        <CardPanel className="teal lighten-4 black-text">
			            <span>I am a very simple card. I am good at containing small bits of information. I am convenient because I require little markup to use effectively. I am similar to what is called a panel in other frameworks.</span>
			        </CardPanel>
			    	</Col>
			     	<Col l={3} s={12} m={7}>
			     	<Row>
			        For a simpler card with less markup, try using a card panel which just has padding and a shadow effect
			   		</Row>
			   		<Row>
			   		<Button waves='light'>EDIT ME<Icon left>save</Icon></Button>
			   		 </Row>
			   		 </Col>
			   		 <Col l={3} s={12}>
			   		 	
			   		 </Col>
			 	</Row>
			</div>
			)
	}
	}