An implementation of Floating Action Button by Google in plain css and javascript.
- Fully customizable
- Light weight
- Doesn't require jquery or bootstrap
- Includes a modal dialog to display messages and videos
npm i minimal_fab
let fab = require('minimal_fab');
fab([
{ type: 'text', text: `Here is some text that I'd like to see in a modal dialog` },
{ type: 'video', link: 'https://www.youtube.com/embed/EfvsNZIW970' },
{ type: 'link', link: 'http://youtube.com', title: 'Go to Youtube' },
{ type: 'custom', callback: () => { console.log('I can do almost anything')} },
]);
You can view the demo at acesmndr.github.io/minimal_fab or dig into the demo source code at Demo Sourcecode
For usage with webpack it requires style-loader
and css-loader
packages and the webpack.config.js
must be set accordingly.
const path = require('path');
module.exports = {
entry: './main.js',
module: {
loaders: [
{ test: /\.css$/, loader: "style-loader!css-loader" }
]
},
output: {
path: path.resolve(__dirname, 'build'),
filename: 'bundle.js'
}
};
Package | Version | Dev |
---|---|---|
sweetalert | ^2.0.8 | ✖ |
font-awesome | * | ✖ |
** Font awesome needs to be loaded separately **
Aashish Manandhar acesmndr@gmail.com http://github.com/acesmndr