React Material Floating Button

Material floating action button implemented as a React component. Also available in vanilla html and Angularjs directive.
Shamelessly Openly inspired by Google Inbox, Evernote and Path.

To add Material Floating Buttons to any project just download or clone the repo from Github. Click on the yellow button here above for a code preview or choose an effect from the dropdown below and interact with any button on the corners of the screen.

To add Material Floating Buttons to any project just download the files from here below or clone the repo from Github.

git clone https://github.com/nobitagit/react-material-floating-button.git

Run npm install and after referencing the styles in your header drop the MFB markup in your HTML like so:

var component = React.createElement(MfbMenu, yourOpts);
React.render( component, document.getElementById('someId') );

The yourOpts object passed as a second param to the createElement function provide the configuration for the component such as position, labels, icons, links and callbacks. All the other styles and configurations are just css.

The best way to customise the styles is to build them directly from the source as the scss file is filled with customizable variables. From there choose your favorite colors and sizes and then compile the css.