Bulma Snippets
Bulma Snippets is extension to make ease to build website refrence to bulma.io
Complete documentation of bulma can see at bulma.io
Features
| Trigger |
Description |
| html:b |
Generate basic html of bulma |
| Trigger |
Description |
| hero:b |
Basic Hero banner |
| hero:b:medium |
Hero banner size medium |
| hero:b:large |
Hero banner size large |
| hero:b:full |
Hero banner size full hight |
| hero:b:nav |
Hero banner with navbar |
| Trigger |
Description |
| navbar:b |
Basic of navbar |
| Trigger |
Description |
| container:b |
Basic of container |
| container:b:fluid |
32px margin on the left and right sides |
| container:b:wide |
a fullwidth container until those specific breakpoints |
| container:b:fullhd |
This container is fullwidth until the $fullhd breakpoint |
| Trigger |
Description |
| columns:b |
Basic Columns |
| columns:b:fourfifths |
Column Four fifths |
| columns:b:threequarters |
Column Three Quarters |
| columns:b:twothirds |
Column Two Thirds |
| columns:b:threefifths |
Column Thee Fifths |
| columns:b:half |
Column Half |
| columns:b:twofifths |
Column Two Fifths |
| columns:b:onethird |
Column One Third |
| columns:b:onequarter |
Column One Quarter |
| columns:b:onefifth |
Column One Fifth |
| columns:b:halfcenter |
Column Half Center |
| columns:b:threecenter |
Column Theree Center |
| columns:b:multiline |
Column Multiline |
| Trigger |
Description |
| title:b |
Basic of title |
| subtitle:b |
Basic of subtitle |
| Trigger |
Description |
| card:b |
Basic of card |
| card:b:full |
Card header and footer |
| Trigger |
Description |
| box:b |
Box of bulma |
| Trigger |
Description |
| button:b |
Button Basic |
| button:b:color |
Button Basic with color |
| button:b:display |
Button Basic with display full width |
| button:b:size |
Button Basic with variant of size |
| button:b:outline |
Button Basic with variant of outline |
| button:b:rounded |
Button Rounded |
| button:b:icon |
Button Icon |
| button:b:group |
Button Group |
| button:b:addons |
Button Addons |
| Trigger |
Description |
| image:b:square |
Ratio Square (or 1 by 1) |
| image:b:1by1 |
Ratio 1 by 1 |
| image:b:5by4 |
Ratio 5 by 4 |
| image:b:4by3 |
Ratio 4 by 3 |
| image:b:3by2 |
Ratio 3 by 2 |
| image:b:5by3 |
Ratio 5 by 3 |
| image:b:16by9 |
Ratio 16 by 9 |
| image:b:2by1 |
Ratio 2 by 1 |
| image:b:3by1 |
Ratio 3 by 1 |
| image:b:4by5 |
Ratio 4 by 5 |
A single class to handle WYSIWYG generated content, where only HTML tags are available
| Trigger |
Description |
| content:b |
Basic Content |
| content:b:small |
Content Small |
| content:b:medium |
Content Medium |
| content:b:large |
Content Large |
| Trigger |
Description |
| notif:b |
Basic of Notification |
| Trigger |
Description |
| icon:b |
Basic of icon |
| Trigger |
Description |
| tag:b |
Basic of icon |
| Trigger |
Description |
| form:b |
General Form input |
| input:b |
Input Form |
| textarea:b |
Textarea Form |
| select:b |
Select Form |
| checkbox:b |
Checkbox Form |
| radio:b |
Radio Form |
| file:b |
file Form |
| Trigger |
Description |
| table:b |
Basic table of bulma |
| Trigger |
Description |
| pag:b |
Basic pagination |
| pag:b:center |
Pagination number in center |
| pag:b:rounded |
Pagination with rounded style |
| Trigger |
Description |
| footer:b |
Basic footer of bulma |
Release Notes
Hello all this is my first extension of vscode about snippets, please mention me on twitter @hifiaz if any question or just you want to know about me
0.0.1
Initial release of bulma snippets
0.0.2
Some components update
- Update shortcut
- Navbar
- Card
- Footer
0.0.3
Update shortcut for ease to use with basic tag,
Update Components
0.0.4
Add support for PHP, Javascript, Typescript, Vue and JSX files
| |
