bulma-grouped
Bulma's extension to create grouped cards and boxes
Quick install
NPM
npm install bulma-grouped
Import
You can import the CSS or SASS file into your project using this snippet after importing 'bulma':
import 'bulma-grouped/dist/css/bulma-grouped.min.css'
or
import 'bulma-grouped/dist/css/bulma-grouped.sass'
Usage
John Smith @johnsmith 31m Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis. John Smith @johnsmith 31m Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis. John Smith @johnsmith 31m Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
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-grouped.sass
- Copy the code form the
bulma-grouped repo
's dist/css/bulma-grouped.sas 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-grouped.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-grouped.sass' or 'bulma-grouped.min.css' in any way you want it.