rsba-button v1.0.1

rsba-button

customization of button component

Install

npm install --save rsba-button

yarn add rsba-button

Usage

import { Icon } from '@material-ui/core'
import React from 'react'

import  Button from 'rsba-button'
import 'rsba-button/dist/index.css'

const App = () => {
  const handleClick = () => {
    let myPromise = new Promise(function(myResolve, myReject) {
    let x = 0;
      if (x == 1) {
        myResolve("OK");
      } else {
        myReject("Error");
      }
    });
    
    myPromise.then(
      function(value) {console.log(value)},
      function(error) {console.log(error)}
    );
  }
  return <Button onClick={handleClick}
  type="button"
  color="btn-red"
  size="btn-small"
  icon={<Icon color="inherit" style={{marginLeft: "10px", marginRight: "10px"}} onClick={() => {}}>calendar_today</Icon>}
  img={<Icon color="inherit" style={{marginRight: "10px"}} onClick={() => {}}>format_align_right</Icon>}>Button</Button>
}

export default App

explaination color

when we use color, use choose on the followings ways. we must prefix with

btn-

  {background-color: #4CAF50;} /* green  */
  {background-color: #008CBA;} /* blue  */
  {background-color: #f44336;} /* red */
  {background-color: #e7e7e7;} /* gray */
  {background-color: #555555;} /* black */

Size

three sizes are available : large, medium, small

other

const COLOR = [
    "btn-green",
    "btn-blue",
    "btn-red",
    "btn-gray",
    "btn-black"
]
const SIZES = [
    "btn-medium",
    "btn-small",
    "btn-large"
]

License

MIT © Feujo