All Projects → WiziShop → Ng Wizi Bulma

WiziShop / Ng Wizi Bulma

Licence: mit
Bulma components for Angular

Projects that are alternatives of or similar to Ng Wizi Bulma

angular2-cookie-law
Angular2+ component that provides a banner to inform users about cookie law
Stars: ✭ 38 (-59.57%)
Mutual labels:  angular2, angular-components
Igniteui Angular
Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps.
Stars: ✭ 433 (+360.64%)
Mutual labels:  angular-components, angular2
Angular-Firebase-Sortable-Table
Angular Firebase Sortable Table is a module that makes tables creation with firebase an easy task.
Stars: ✭ 28 (-70.21%)
Mutual labels:  angular2, angular-components
Ng Select
⭐ Native angular select component
Stars: ✭ 2,781 (+2858.51%)
Mutual labels:  angular-components, angular2
Angular Prest
pREST component for Angular
Stars: ✭ 16 (-82.98%)
Mutual labels:  angular-components, angular2
Angular4-seed
Angular 4 Seed for Angular Forms
Stars: ✭ 37 (-60.64%)
Mutual labels:  angular2, angular-components
Ngx Charts
📊 Declarative Charting Framework for Angular
Stars: ✭ 4,057 (+4215.96%)
Mutual labels:  angular-components, angular2
Fef
The Front End Framework is a Thomson Reuters Tax and Accounting project to create a re-usable library for creating rich HTML based applications. The end goal is to assemble the publicly available libraries into a reference application with documentation along with best practice architecture.
Stars: ✭ 96 (+2.13%)
Mutual labels:  angular-components, angular2
Videogular2
The HTML5 video player for Angular 2
Stars: ✭ 678 (+621.28%)
Mutual labels:  angular-components, angular2
Angular Commerce
Angular components for scaffolding online store
Stars: ✭ 526 (+459.57%)
Mutual labels:  angular-components, angular2
Ng Drag Drop
Drag & Drop for Angular - based on HTML5 with no external dependencies. 🎉
Stars: ✭ 233 (+147.87%)
Mutual labels:  angular-components, angular2
Dejajs Components
Angular components
Stars: ✭ 37 (-60.64%)
Mutual labels:  angular-components, angular2
Awesome Ionic2 Components
Should help you to get awesome components and plugins for Ionic2
Stars: ✭ 209 (+122.34%)
Mutual labels:  angular-components, angular2
awesome-angular
💖 A list of awesome Angular (2️⃣➕) resources
Stars: ✭ 61 (-35.11%)
Mutual labels:  angular2, angular-components
Ng Simple Slideshow
A simple, responsive slideshow for Angular 4+.
Stars: ✭ 119 (+26.6%)
Mutual labels:  angular-components, angular2
Angular Interview Questions
Most extensive Angular interview questions based on your level.
Stars: ✭ 354 (+276.6%)
Mutual labels:  angular-components, angular2
Ngx Datatable
✨ A feature-rich yet lightweight data-table crafted for Angular
Stars: ✭ 4,415 (+4596.81%)
Mutual labels:  angular-components, angular2
Nebular
💥 Customizable Angular UI Library based on Eva Design System 🌚✨Dark Mode
Stars: ✭ 7,368 (+7738.3%)
Mutual labels:  angular-components, angular2
Awesome Angular
📄 A curated list of awesome Angular resources
Stars: ✭ 8,160 (+8580.85%)
Mutual labels:  angular-components, angular2
Shinybulma
🌐 Bulma.io for Shiny
Stars: ✭ 86 (-8.51%)
Mutual labels:  bulma

NG Wizi Bulma

npm npm

Bulma components for Angular 9+

The library uses ng-packagr to transpile into the Angular Package Format

Demo

Try out the demo

Install

Run:

npm i -S @wizishop/ng-wizi-bulma bulma bulma-extensions @angular/cdk

Import bulma (and needed extensions) scss into your main scss file:

@import '~bulma';
@import '~bulma-extensions/bulma-switch/src/sass/index';
@import '~bulma-extensions/bulma-tooltip/src/sass/index';
@import '~bulma-extensions/bulma-calendar/src/sass/index';

After Bulma, import ng-wizi-bulma scss into your main scss file allowing you to custom all variable from bulma:

@import '[email protected]/ng-wizi-bulma/ng-wizi-bulma';

Load the Fontawesome icon font in your index.html.

 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" crossorigin="anonymous">

Import the required modules BrowserAnimationsModule and FormsModule into your app module, then import either all Nwb modules with NwbAllModule or only the module you want to use in your application for example `NwbDialogModule

import {ApplicationRef, NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {HttpModule} from '@angular/http';
import {FormsModule} from '@angular/forms';

import {NwbAllModule} from '@wizishop/ng-wizi-bulma';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    BrowserAnimationsModule,
    NwbAllModule,
  ],
  declarations: [],
  providers: [],
  entryComponents: [],
})
export class AppModule {

}

How to use it

If you want to see how components work, just see the demo file : src/demo-app/demo-app/demo-app.ts

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].