Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

@ueqt/uma

9.0.5 • Public • Published

Uma

Ueqt's angular material components.

npm version Publish to npm Build and Deploy

All the components are created using just Angular, Material 2 and CDK.

Check out our documentation & live demo

Components Status

All the components have the prefix uma followed by the package name.

Component Status package
Html Tooltip Available uma-tooltip
Color Picker Available uma-color-picker
Scrollspy Available uma-scrollspy
Speed Dial Available uma-speed-dial
Timer Picker Available uma-timer-picker

If you miss any component, please follow the CONTRIBUTION GUIDELINE to open an issue.

Install

step: 1

We use some components from the Angular Material. To be able to use this component, you have to install the @angular/animations. If you follow all the steps in Material Guide, you already have this step done.

    npm install --save @angular/animations

Note: @angular/animations uses the WebAnimation API that isn't supported by all browsers yet. If you want to support Material component animations in these browsers, you'll have to include a polyfill.

import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 
@NgModule({
  ...
  imports[BrowserAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }

If you don't want to add another dependency to your project, you can use the NoopAnimationsModule.

import {NoopAnimationsModule} from '@angular/platform-browser/animations';
 
@NgModule({
  ...
  imports[NoopAnimationsModule],
  ...
})
export class PizzaPartyAppModule { }

step: 2

Install uma package:

    npm install @ueqt/uma

Theming

To use the same theme of Angular Material add the following code to your style.scss.

@import '~@angular/material/theming';
@import '~uma/theming';
 
@include mat-core();
 
// Define the palettes for your theme using the Material Design palettes available in palette.scss 
// (imported above). For each palette, you can optionally specify a default, lighter, and darker 
// hue. Available color palettes: https://material.io/design/color/ 
$demo-primary: mat-palette($mat-green);
$demo-accent: mat-palette($mat-pink, A200, A100, A400);
 
// The warn palette is optional (defaults to red). 
$demo-warn: mat-palette($mat-red);
 
// Create the theme object (a Sass map containing all of the palettes). 
$demo-theme: mat-light-theme($demo-primary, $demo-accent, $demo-warn);
 
// build angular material theme 
@include angular-material-theme($demo-theme);
 
// pass angular material theme to ueqt's material components 
@include uma-theme($demo-theme);

this is only available for the timer-picker component

How to use

For more examples, you can see our app-demo folder or read the full documentation

package

version need change src/lib/package.json

License

The MIT License (MIT) Copyright (c) 2020

Install

npm i @ueqt/uma

DownloadsWeekly Downloads

2

Version

9.0.5

License

MIT

Unpacked Size

1.88 MB

Total Files

120

Last publish

Collaborators

  • avatar