import React from 'react'
import injectSheet from 'react-jss'
import classNames from 'classnames'

const Button = ({ classes, onClick, buttonText, activeState, type, size }) => {
	const activeClass = activeState ? classes.active : classes.inactive
	return (
		<button
			type={type}
			className={classNames(activeClass, classes[size], classes.default)}
			onClick={onClick}
		>
			{buttonText}
		</button>
	)
}

const styles = {
	default: {
		// this class will be applied to all button
		outline: 'none',
		'font-size': '.75em',
		'font-weight': 'bold',
	},
	inactive: {
		// this class will be applied to button which will have props btnType == balckAndWhite
		color: '#000',
		'background-color': '#fff',
		'&:hover': {
			color: '#fff',
			'border-color': '#f28274',
			'background-color': '#f28274',
		},
	},
	active: {
		// this class will be applied to button which will have props btnType == orange
		color: '#fff',
		'border-color': '#f28274',
		'background-color': '#f28274',
	},
	medium: {
		height: '49.69px',
		width: '153.18px',
		border: '2px solid #000000',
		'border-radius': '100px',
	},
	large: {
		'font-size': '1.25em',
		height: '48.84px',
		width: '280px',
		border: '2px solid #000000',
		'border-radius': '100px',
	},
}

export default injectSheet(styles)(Button)

@@ -441,225 +441,151 @@
 %7B%0A%09%09
-// this class will be applied to all button%0A%09%09outline: 'none',%0A%09%09'font-size': '.75em',%0A%09%09'font-weight': 'bold',%0A%09%7D,%0A%09inactive: %7B%0A%09%09// this class will be applied to button which will have props btnType == balckAndWhite
+outline: 'none',%0A%09%09'font-weight': 'bold',%0A%09%09border: '2px solid #000000',%0A%09%09'border-radius': '100px',%0A%09%09'text-align': 'center',%0A%09%7D,%0A%09inactive: %7B
 %0A%09%09c
@@ -749,90 +749,8 @@
 : %7B%0A
-%09%09// this class will be applied to button which will have props btnType == orange%0A
 %09%09co
@@ -839,16 +839,39 @@
 dium: %7B%0A
+%09%09'font-size': '15px',%0A
 %09%09height
@@ -910,60 +910,56 @@
 ,%0A%09%09
-border: '2px solid #000000',%0A%09%09'border-radius
+'letter-spacing': '0.23px',%0A%09%09'line-height
 ': '1
-00
+8
 px',
@@ -994,13 +994,11 @@
 : '1
-.25em
+8px
 ',%0A%09
@@ -1041,60 +1041,55 @@
 ,%0A%09%09
-border: '2px solid #000000',%0A%09%09'border-radius
+'letter-spacing': '0.3px',%0A%09%09'line-height
 ': '
-100
+22
 px',

Update button text size to match invision designs