bulma-floating-button
Bulma's extension to create floating buttons
Quick install
NPM
npm install bulma-floating-button
Import
You can import the CSS or SASS file into your project using this snippet after importing 'bulma':
import 'bulma-floating-button/dist/css/bulma-floating-button.min.css'
or
import 'bulma-floating-button/dist/css/bulma-floating-button.sass'
Usage
You can use .is-floating with size and color modifiers
<!-- SIZES -->
Example
Integration to Bulma
- Clone the bulma repo
- Under the
sass
folder, create a new folder calledextensions
- In this new folder, create a new file
bulma-floating-button.sass
- Copy the code form the
bulma-floating-button repo
's dist/css/bulma-floating-button.sass file into your new file - In the same folder create a new file
_all.sass
(this is not required, but will help when you add more extensions) - In this file add this code:
@charset "utf-8"
@import "bulma-floating-button.sass"
At the end of the bulma.sass
file, add this line: @import "sass/extensions/_all"
Now, you can just build the bulma project with npm run build
, and the output will be available in the css folder
.
OR
- Just add the 'bulma-floating-button.sass' or 'bulma-floating-button.min.css' in any way you want it.