react-lite-button

A simple and liteweight react button with linear gradient capabilities and with awesome loader

This package uses react-spinners in order to use loader functions

Example

Buttom Loader example

Install

npm install --save react-lite-button

Usage

import React, { Component } from "react";

import MyComponent from "react-lite-button";

class Example extends Component {
  render() {
    return <MyComponent />;
  }
}

To enable loader

import React, { Component } from "react";

import MyComponent from "react-lite-button";

class Example extends Component {
  render() {
    return <MyComponent loading = {isLoading} {...other props are listed down} />;
  }
}

| Prop Name | Type | Default | Description | | ------------ | ---------------- | ------------------------------------------ | ----------------------------------------------------------- | | title | string | nameless | Title of the button | | onClick | function | null | onClick function after the button in clicked | | colors | array | ["#fe6b8b" , "#ff8e53"] | require two colors inorder work show linear-gradient | | textColor | string | white | color of the text appears inside the button | | textSize | number | 17 | fontSize | | width | number or string | '100%' | specify the width of the button within the string or number | | borderRadius | number or string | 3 | borderRadius of the button | | height | number or string | 48 | height of the button | | shadow | string | "0px 3px 5px 2px rgba(255, 105, 135, 0.3)" | button shadow color | | loading | boolean | false | whether the button is currently | | loaderType | string | ClipLoader | More loaders @ | | loaderSize | number or string | 30 | size of the loader | | loaderColor | string | 'white' | color of the loader |

License

MIT © sky32752