https://github.com/bulmabuildingblocks/bulmabuildingblocks

Bulma Building Blocks is a lightweight library of responsive HTML components based on the Bulma framework.
https://github.com/bulmabuildingblocks/bulmabuildingblocks

builder building-blocks bulma html

Last synced: 3 months ago
JSON representation

Bulma Building Blocks is a lightweight library of responsive HTML components based on the Bulma framework.

• Host: GitHub
• URL: https://github.com/bulmabuildingblocks/bulmabuildingblocks
• Owner: BulmaBuildingBlocks
• License: mit
• Archived: true
• Created: 2020-03-14T00:35:07.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2023-05-08T18:21:32.000Z (over 1 year ago)
• Last Synced: 2024-10-13T17:59:41.524Z (3 months ago)
• Topics: builder, building-blocks, bulma, html
• Language: SCSS
• Homepage: https://bulmabuildingblocks.herokuapp.com/
• Size: 7.04 MB
• Stars: 5
• Watchers: 4
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        


  

    

  





  

    

  

  

    

  

  

    

  

  

    

  

  

    

  



> Bulma Building Blocks is a lightweight library of responsive HTML snippets based on [Bulma](http://bulma.io/) framework and design.

## Features

* Keep your current Bulma theme / variables easily

* Very lightweight with none internal dependencies aside from Bulma

## Documentation

Browse [online documentation here](https://bulmabuildingblocks.herokuapp.com/).

## Getting Started

### Use the Builder

https://bulmabuildingblocks.herokuapp.com/page-builder

### Standalone

Using CDN or downloading files to serve local

* The css file comes with Bulma and Bulma Building Blocks.

**Installation**

Just download or use the CDN:

https://unpkg.com/bulmabuildingblocks/dist/bulmabuildingblocks.min.css

### Using npm

Install the npm package

    npm install bulmabuildingblocks

Look at the below example of how to import using npm

    // Bulma Building Block

    @import 'bulmabuildingblocks';

Look at the below example of how to import into an existing Bulma project using npm, you can leave out the variable file if you don't want the same configuration as Bulma Building Blocks

    // Bulma Building Block variables

    @import 'bulmabuildingblocks/src/initial-variables';

    // Bulma

    @import 'bulma/bulma';

    

    // Bulma Building Block

    @import 'bulmabuildingblocks/src/main';

    

### Use the skeleton

Use the template below as a starting point, copy the html snippets into the recommended area.

    

    

      

        

        

        Bulma Building Block

        

        

      

      

         

      

    

## Contributing

Contributions, issues and feature requests are welcome!
Feel free to check [issues page](https://github.com/BulmaBuildingBlocks/BulmaBuildingBlocks/issues).

## Core Team

  

    
Joseph Anson


  

## Copyright and license

Code Copyright 2021 Joseph Anson. Code released under the MIT license.