Bootstrap 4 Snippets for Brackets

A collection of Bootstrap snippets for Brackets editor.

Install

Git Clone

1. Under main menu select Help > Show Extensions Folder
2. Git clone this repository inside the folder user.

Extension Manager

1. Under main menu select File > Extension Manager...
2. Search for "RCH Bootstrap snippets"
3. Click "Install"

How to use

1. Enable RCH Bootstrap Snippets Under main menu select Edit > Enable RCH Bootstrap Snippets
2. Start typing "bs4" and you'll see the snippets list (code hint provider), just pick a snippet and press ENTER, or
3. Enter a snippet and hit the Tab key (alternatively you can also hit the key DOWN).

Snippets list

Bootstrap 4 - HTML5 blank Templates

Basic html template with local assets links

bs4
bs4html_local

Basic html template with CDNs assets links

bs4html
bs4template 

Alerts

Dismissible Alert

bs4alert (primary style)
bs4alert_danger
bs4alert_dark
bs4alert_info
bs4alert_light
bs4alert_secondary
bs4alert_success
bs4alert_warning

Basic text Alert

bs4alertbasic (primary style)
bs4alertbasic_danger
bs4alertbasic_dark
bs4alertbasic_info
bs4alertbasic_light
bs4alertbasic_secondary
bs4alertbasic_success
bs4alertbasic_warning

Alert Box (with heading, paragraph and divider)

bs4alertbox (primary style)
bs4alertbox_danger
bs4alertbox_dark
bs4alertbox_info
bs4alertbox_light
bs4alertbox_secondary
bs4alertbox_success
bs4alertbox_warning

Badge

Basics

bs4badge (primary style)
bs4badge_danger
bs4badge_dark
bs4badge_info
bs4badge_light
bs4badge_secondary
bs4badge_success
bs4badge_warning

Pills Badges

bs4badgepill (primary style in pill)
bs4badgepill_danger
bs4badgepill_dark
bs4badgepill_info
bs4badgepill_light
bs4badgepill_secondary
bs4badgepill_success
bs4badgepill_warning

Links Badges

bs4badgelink (primary style in link)
bs4badgelink_danger
bs4badgelink_dark
bs4badgelink_info
bs4badgelink_light
bs4badgelink_secondary
bs4badgelink_success
bs4badgelink_warning

Breadcrumbs

bs4breadcrumbs 

Buttons

(TODO: inputs tags)

Link buttons

bs4abtn (primary)
bs4abtn_danger
bs4abtn_dark
bs4abtn_info
bs4abtn_light
bs4abtn_link
bs4abtn_secondary
bs4abtn_success
bs4abtn_warning

bs4abtnblock (primary)
bs4abtnblock_danger
bs4abtnblock_dark
bs4abtnblock_info
bs4abtnblock_light
bs4abtnblock_link
bs4abtnblock_secondary
bs4abtnblock_success
bs4abtnblock_warning

bs4abtnlg (primary)
bs4abtnlg_danger
bs4abtnlg_dark
bs4abtnlg_info
bs4abtnlg_light
bs4abtnlg_link
bs4abtnlg_secondary
bs4abtnlg_success
bs4abtnlg_warning

bs4abtnsm (primary)
bs4abtnsm_danger
bs4abtnsm_dark
bs4abtnsm_info
bs4abtnsm_light
bs4abtnsm_link
bs4abtnsm_secondary
bs4abtnsm_success
bs4abtnsm_warning

Outlined links buttons

bs4abtnol (primary)
bs4abtnol_danger
bs4abtnol_dark
bs4abtnol_info
bs4abtnol_light
bs4abtnol_link
bs4abtnol_secondary
bs4abtnol_success
bs4abtnol_warning

bs4abtnolblock (primary)
bs4abtnolblock_danger
bs4abtnolblock_dark
bs4abtnolblock_info
bs4abtnolblock_light
bs4abtnolblock_link
bs4abtnolblock_secondary
bs4abtnolblock_success
bs4abtnolblock_warning

bs4abtnollg (primary)
bs4abtnollg_danger
bs4abtnollg_dark
bs4abtnollg_info
bs4abtnollg_light
bs4abtnollg_link
bs4abtnollg_secondary
bs4abtnollg_success
bs4abtnollg_warning

bs4abtnolsm (primary)
bs4abtnolsm_danger
bs4abtnolsm_dark
bs4abtnolsm_info
bs4abtnolsm_light
bs4abtnolsm_link
bs4abtnolsm_secondary
bs4abtnolsm_success
bs4abtnolsm_warning

Buttons (button tag)

bs4btn (primary)
bs4btn_danger
bs4btn_dark
bs4btn_info
bs4btn_light
bs4btn_link
bs4btn_secondary
bs4btn_success
bs4btn_warning

bs4btnblock (primary)
bs4btnblock_danger
bs4btnblock_dark
bs4btnblock_info
bs4btnblock_light
bs4btnblock_link
bs4btnblock_secondary
bs4btnblock_success
bs4btnblock_warning

bs4btnlg (primary)
bs4btnlg_danger
bs4btnlg_dark
bs4btnlg_info
bs4btnlg_light
bs4btnlg_link
bs4btnlg_secondary
bs4btnlg_success
bs4btnlg_warning

bs4btnsm (primary)
bs4btnsm_danger
bs4btnsm_dark
bs4btnsm_info
bs4btnsm_light
bs4btnsm_link
bs4btnsm_secondary
bs4btnsm_success
bs4btnsm_warning

Outlined buttons (button tag)

bs4btnol (primary)
bs4btnol_danger
bs4btnol_dark
bs4btnol_info
bs4btnol_light
bs4btnol_link
bs4btnol_secondary
bs4btnol_success
bs4btnol_warning

bs4btnolblock (primary)
bs4btnolblock_danger
bs4btnolblock_dark
bs4btnolblock_info
bs4btnolblock_light
bs4btnolblock_link
bs4btnolblock_secondary
bs4btnolblock_success
bs4btnolblock_warning

bs4btnollg (primary)
bs4btnollg_danger
bs4btnollg_dark
bs4btnollg_info
bs4btnollg_light
bs4btnollg_link
bs4btnollg_secondary
bs4btnollg_success
bs4btnollg_warning

bs4btnolsm (primary)
bs4btnolsm_danger
bs4btnolsm_dark
bs4btnolsm_info
bs4btnolsm_light
bs4btnolsm_link
bs4btnolsm_secondary
bs4btnolsm_success
bs4btnolsm_warning

Button Groups

bs4btngroup
bs4btngroup_bar
bs4btngroup_nested
bs4btngroup_vertical
bs4btngrouplg
bs4btngroupsm

Cards

Single cards

bs4card
bs4cardfeatured
bs4cardfull
bs4cardimage
bs4cardimage_bottom
bs4cardimage_overlay
bs4cardpanel
bs4cardpanel_minimal
bs4cardquote

Cards layout

bs4cardgroup
bs4cardgroup_footer
bs4carddeck
bs4carddeck_footer
bs4cardcolumns

Carousel

bs4carousel (basic slider)
bs4carouselfull
bs4carouselwcaptions
bs4carouselwcontrols
bs4carouselwindicators
bs4carousel_fade
bs4carouselfull_fade
bs4carouselwcaptions_fade
bs4carouselwcontrols_fade
bs4carouselwindicators_fade

Collapse and Accordions

bs4collapse_btn
bs4collapse_link
bs4collapse_panel
bs4accordion
bs4accordion_minimal

CDN

bs4cdncss
bs4cdnjs

Embeds

bs4embed (default 1:1)
bs4embed_4x3
bs4embed_16x9
bs4embed-21x9

Figures

bs4figure

Forms

Form Controls

bs4formcontrol_input
bs4formcontrol_password
bs4formcontrol_email
bs4formcontrol_readonly
bs4formcontrol_select
bs4formcontrol_selectmultiple
bs4formcontrol_textarea
bs4formcontrol_file
bs4formcontrol_checkbox
bs4formcontrol_checkbox_group
bs4formcontrol_radio
bs4formcontrol_radio_group

Basic Forms

bs4form_contact
bs4form_login
bs4form_full 
bs4form_suscribe_inline

Images (simple, thumbnail and picture)

bs4image
bs4image_rounded
bs4image_circle
bs4imagethumbnail
bs4imagethumbnail_rounded
bs4imagethumbnail_circle
bs4image_picture

Jumbotron

bs4jumbotron
bs4jumbotron_fluid

List Groups

bs4listgroup
bs4listgroup_badges
bs4listgroup_content
bs4listgroup_links

Local

bs4localcss
bs4localjs

Media

bs4mediaobject

Modal

bs4modal
bs4modalbtn

Navs

bs4nav
bs4nav_center
bs4nav_right
bs4nav_vertical
bs4navlist
bs4navlist_center
bs4navlist_right
bs4navlist_vertical
bs4navpills
bs4navpills_center
bs4navpills_right
bs4navpills_vertical
bs4navpillslist
bs4navpillslist_center
bs4navpillslist_right
bs4navpillslist_vertical

Navigation

bs4navbar (full)
bs4navbar_basic
bs4navbar_centered

Pagination

bs4pagination (basic, left aligned)
bs4pagination_icons
bs4pagination_centered
bs4pagination_right

Tabs

bs4tabs
bs4tabs_vertical

Tables

bs4table (basic)
bs4table_bordered
bs4table_borderless
bs4table_dark
bs4table_responsive
bs4table_striped

Credits

• Bootstrap Framework - https://getbootstrap.com
• jQuery JavaScript Library v3.3.1 - jQuery Foundation, Inc. and other contributors
• Snippets based on Bootstrap 3 Sublime Plugin - Thanks Jason Morton - Twitter @JasonMortonNZ
• Snippets based on ACB Bootstrap Snippets Plugin - Thanks Antonio Carlos Barbosa
• Source-code editor used in this project - Brackets - https://www.brackets.io
• Badges in this screen are generated by the amazing project of Boris K https://github.com/brackets-extension-badges/badge-provider-nodejs

Thank you all!

If this project helps you to develop faster and nicer, maybe you can invite me a cup of coffee :)

License

MIT for this project.

Copyright (c) 2017 Ricardo Javier Rodriguez Released under the MIT license