fuel-ui
TypeScript icon, indicating that this package has built-in type declarations

0.3.9 • Public • Published

Fuel-UI npm version npm downloads Dependency Status devDependency Status

A set of UI components for use with Angular 2 and Bootstrap 4.

See Fuel-UI homepage for live demo and documentation.

Dependencies

  • Node
  • Gulp

Build

Execute the following commands to run the demo in your local environment. A browser window pops up with the demo running at http://localhost:8001

npm install
gulp

Installation

Fork our Quickstart! https://github.com/coryshaw1/ng2-play/

Fork our angular-cli Quickstart! https://github.com/FuelInteractive/fuel-ui-cli-quickstart/

Manually

If you would like to add Fuel-UI to your Angular2 project through npm manually, do the following:

npm install fuel-ui font-awesome bootstrap@^4.0.0-alpha.2 --save

Then simply add the proper script tags to your index.html

<head>
  <link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css" />
  <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css" />
  <link rel="stylesheet" href="node_modules/fuel-ui/bundles/fuel-ui.min.css" />
</head>
 
...
 
<!-- All your SystemJS, Angular2, Rx, etc. scripts first! -->
<script src="node_modules/fuel-ui/bundles/fuel-ui.min.js"></script>

Manually with angular-cli

ng new example-project
cd example-project
npm install fuel-ui font-awesome bootstrap@^4.0.0-alpha.2 --save

Go to your angular-cli-build.js file, and add the following to your vendorNpmFiles array:

'bootstrap/**/bootstrap.min.css',
'font-awesome/**/font-awesome.min.css',
'font-awesome/fonts/*',
'fuel-ui/bundles/*'

Now build the project to copy over the necessary files to your vendor directory

ng build

Then simply add the proper script tags to your index.html

<head>
  <link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css" />
  <link rel="stylesheet" href="vendor/bootstrap/dist/css/bootstrap.min.css" />
  <link rel="stylesheet" href="vendor/fuel-ui/bundles/fuel-ui.min.css" />
</head>
 
...
 
<!-- All your SystemJS, Angular2, Rx, zone, etc. scripts first! -->
<script src="vendor/fuel-ui/bundles/fuel-ui.min.js"></script>

Animations

Components

Directives

Pipes

Package Sidebar

Install

npm i fuel-ui

Weekly Downloads

2

Version

0.3.9

License

ISC

Last publish

Collaborators

  • coryshaw
  • stacygay