@festo-ui/angular

CSS framework and utils to build FESTO web applications

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@festo-ui/angular
4.0.13 days agoa year agoMinified + gzip package size for @festo-ui/angular in KB

Readme

FESTO UI

Angular Component Library

Getting started

Festo Angular comes as a NPM package. Oh you don't know NPM? Then you must start a bit further at Node.js.
If you want to use the Festo Angular library with your Angular project then this command is the way to go:
npm install @festo-ui/angular

Peer dependencies

We have set the @festo-ui/web-essentials and the @angular/cdk as peer dependency. Make sure you have it installed:
npm install @festo-ui/web-essentials
npm install @angular/cdk

Required CSS

You should add the CSS files to your angular.json file to load the styles when your Angular projects get built.
Example:
{
  "projects": {
    "projectName": {
      ...
      "architect": {
        "build": {
          ...
          "options": {
            ...
            "styles": [
              ...
              "node_modules/@festo-ui/web-essentials/dist/css/festo-web-essentials.min.css",
              "node_modules/@festo-ui/angular/css/bundle.css"
            ],
            ...

If you only want to load the styles for popovers or image gallery you can use following paths: - node_modules/@festo-ui/angular/css/popover.css - node_modules/@festo-ui/angular/css/iamge-gallery.css

Modules

After installation you have to import the FestoAngularModule and the BrowserAnimationsModule to your root module (called app.module.ts in the majority of projects). Have a look at the following example:
import { FestoAngularModule } from '@festo-ui/angular';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, BrowserAnimationsModule, FormsModule, ReactiveFormsModule, FestoAngularModule, AppRoutingModule],
  providers: []
})
export class AppModule {}