react-sweet-toobar

react-sweet-toobar as React components

Description

React based component Toobar. Enhance user experience of Toobar.

Preview

Installation

Install via npm

Step 1:

npm install --save react-sweet-toobar

Step 2:

• include node_module/react-sweet-toobar/dist/css/SweetToobar.css

Usage

• iconName please refer react-icons Font-Awesome

import React from 'react';
import ReactDOM from 'react-dom';

import SweetToobar from "react-sweet-toobar";

const initConfig = [
  {
    iconName: 'FaFacebook',
    clickFn: function () {
      console.log('Handle Facebook Click');
    }
  },
  {
    iconName: 'FaTwitter',
    clickFn: function () {
      console.log('Handle Twitter Click');
    }
  },
  {
    iconName: 'FaPinterest',
    clickFn: function () {
      console.log('Handle Pinterest Click');
    }
  },
  {
    iconName: 'FaTumblr',
    clickFn: function () {
      console.log('Handle Tumblr Click');
    }
  },
  {
    iconName: 'FaGooglePlus',
    clickFn: function () {
      console.log('Handle Google Plus Click');
    }
  }
];

ReactDOM.render(
  <div style={styles.main}>
    <SweetToolbar initConfig={initConfig} />
  </div>,
  document.getElementById("react")
);

Author

Designer: Bill Chen ([email protected])

Coder: smallma ([email protected])

License

MIT