Angular2-Bulma
Angular2-Bulma is providing Bulma CSS Framework components to Angular developers for fast and easy development.
Content
-
Installation and setup
-
Components
- bu-columns : Columns
- bu-section : Section
- bu-hero : Hero
- bu-container : Container
- bu-conent : Content
- bu-footer : Footer
- bu-box : Box
- bu-button : Button
- bu-delete : Delete
- bu-icon : Icon
- bu-image : Image
- bu-notification : Notification
- bu-progress : Progress
- bu-tag : Tag
- bu-breadcrumb : Breadcrumb
- bu-card : Card
- bu-dropdown : Dropdown
- bu-menu : Menu
- bu-message : Message
- bu-navbar : Navbar
- bu-tabs : Tabs
Installation and setup
npm install bulma angular2-bulma --save
Import Bulma CSS
In your main style.css file import Bulma CSS styles:
;
If you want to change values for some of bulma css variables define them before @import.
$;
Font Awesome Icons
If you want to use icons add into your index.html file.
<!-- Add fontawesome -->
Import Angular2BulmaModule
Import Angular2BulmaModule in your app.module.ts file and add it into imports array.
;; ;;
This will import all of the Angular2-Bulma component modules. But you can also import any of the individual component modules. Maybe you need only Tabs for your application so you can import only BuTabsModule without any other.