Bulma snippets

A set of Bulma Snippets for Visual Studio Code.

Please visit the real bulma website http://bulma.io/

The most of the snippets of this pluggin have been imported from http://bulma.io/

Using

Create a new HTML document and type 'bul' to see all available snippets.

Trigger	Description
bul-cdn:css	Cdnjs for the head element
bul:html	A bulma html 5 page

Trigger	Description
bul-grid:columns-gapless	If you want to remove the space between the columns, add the is-gapless modifier on the columns container
bul-grid:columns	A simple way to build responsive columns

Trigger	Description
bul-box	A white box to contain other elements
bul-buttons:disabled	The classic button, in different colors, sizes, and states - Disabled
bul-buttons:font-awesome-icons	The classic button, in different colors, sizes, and states- With Font Awesome icons
bul-buttons-group	If you want to group buttons together, use the is-grouped modifier on the field container
bul-buttons:inverted	Inverted (the text color becomes the background color, and vice-versa)
bul-buttons:loading	Loading buttons
bul-buttons:sizes	Buttons sizes
bul-buttons:styles	Buttons sizes outlined
bul-buttons	The classic button, in different colors, sizes, and states
bul-deletes	A versatile delete cross
bul-form:addons-select	If you want a full width select dropdown, pair control is-expanded with select is-fullwidth
bul-form:addons	If you want to attach controls together, use the has-addons modifier on the control container
bul-form:controls	All generic form controls, designed for consistency
bul-form:group	If you want to group controls together, use the is-grouped modifier on the control container.
bul-notifications	Bold notification blocks, to alert your users of something
bul-progress	Native HTML progress bars
bul-table	Simple responsive horizontal navigation tabs, with different styles
bul-tags	Small tag labels to insert anywhere

Trigger	Description
bul-card	An all-around flexible and composable component
bul-level:centered	If you want a centered level, you can use as many level-item as you want, as long as they are direct children of the level container
bul-level:mobile	"By default, for space concerns, the level is vertical on mobile. If you want the level to be horizontal on mobile as well, add the is-mobile modifier on the level container.
bul-level	A multi-purpose horizontal level, which can contain almost any other element
bul-menu	A simple menu, for any type of vertical navigation
bul-messages	Colored message blocks, to emphasize part of your page
bul-nav	A responsive horizontal nav bar that can contain links, tabs, buttons, icons, and a logo
bul-panel	A composable panel, for compact controls
bul-tabs	Simple responsive horizontal navigation tabs, with different styles

Trigger	Description
bul-container:centered	If you don't want to have a maximum width but want to keep the 20px margin on the left and right sides, add the is-fluid modifier
bul-container:fluid	If you don't want to have a maximum width but want to keep the 20px margin on the left and right sides, add the is-fluid modifier
bul-hero	An imposing hero banner to showcase something
bul-section	A simple container to divide your page into sections, like the one you're currently reading
bul-footer	A simple responsive footer which can include anything: lists, headings, columns, icons, buttons...