Includes some of the most common components includng buttons, tabs, dialogs, cards, table grids and more.

These sample components use Bulma for CSS styling.

Note: Feel free to adapt any of the components or examples to any other CSS framework of your preference. You can use Tailwind, Bootstrap or try them out with your own CSS styles.

Usage

To use bulma's CSS styles, choose one of the following methods:

1. Using CDN or downloading files

Add the following line to your root.html.leex:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css"/>

Or download the .css file and manually add it to your priv/static/css folder. In this case, add the following line to your root.html.leex:

<link rel="stylesheet" href={Routes.static_path(@conn, "/css/bulma.min.css")} />

2. NPM or Yarn

Add bulma to the list of dependencies in assets/package.json:

"dependencies": {
  ...
  "bulma": "0.9.3"
}