Bulma CSS

Bulma CSS is a modern Drupal (8, 9, 10, 11…) base theme based on Bulma. Bulma is a modern CSS framework based on the Flexbox CSS3 layout mode.

Most Bulma features are well integrated within Drupal.

While Bulma CSS is designed as a base theme, development also focuses on making the theme look good "out of the box", so it may be used directly on a site without subtheming.

Features

• Components and plugins from Bulma.
• Sass and Font Awesome built in.

What is Bulma

Bulma is a modern CSS framework based on Flexbox. As such, the sole output is a single CSS file: bulma.css

You can either use that file "out of the box", or customize Sass source files.

There is no JavaScript included. (The 1.x version of the theme includes a few lines to open/close mobile menus)

Bulma can be considered "environment agnostic": It is the style layer on top of the logic.

For more information on Bulma, please their website bulma.io.

Browser support

Bulma uses autoprefixer to make (most) Flexbox features compatible with earlier browser versions. Bulma is compatible with recent versions of:

• Chrome
• Edge
• Firefox
• Opera
• Safari
• Internet Explorer (10+) is only partially supported.

Installation

Install theme as usual. Customize Sass inside your own subtheme, not in the base theme.

Configuration

Check the theme settings page to activate additional features (on installation of the base theme, some are already enabled).

One configuration option is the ability to select from the Bulmaswatch set of skins or themes.

Versions

Bulma 1.x.stays with versions of the Bulma framework prior to 1.0.0.

Bulma 3.0.x uses the 1.0.0+ releases of the Bulma framework and also drops the previously included JavaScript as well as Bulma swatches, Bulma extensions, and Bulma helpers.

Contributed themes based on Bulma

• Octavia.