Angularx-wrapper NPM

angularx-wrapper

Simple wrapper to create an elevated container using Angular Material.

Online Demo

https://angularx-wrapper.byh.uy/

Prerequisites:

This library requires @angular/material and lodash.
If you do not have one, make sure to install them in your project folder by running ng add @angular/material and npm install --save lodash.

Getting Started

Run npm install --save angularx-wrapper.
Import AngularXWrapperModule into your app.module:

...
import { AngularXWrapperModule } from 'angularx-wrapper';

@NgModule({
  ...
  imports: [
    ...
    AngularXWrapperModule
  ]
})
export class AppModule { }

Usage

<angularx-wrapper>
    Your content goes here.
</angularx-wrapper>

Directives

Properties

Name	Type/Interface	Default	Description
`@Input('ngxClass')`	string \| string[]	[]	Custom class name(s) for the wrapper
`@Input('ngxStyle')`	{}	{}	Just like ngStyle, this accepts the styles for the wrapper
`@Input('elevation')`	number (0 - 24)	5	Elevation level (the higher the number, the more elevated the wrapper appears)
`@Input('width')`	number \| string	'900px'	The wrapper's width
`@Input('padding')`	number \| string	'32px'	Padding between the wrapper and its content
`@Input('align' )`	'center' \| 'left' \| 'right'	'left'	The wrapper's alignment
`@Input('contentAlign')`	'center' \| 'left' \| 'right'	'left'	Content's alignment inside the wrapper
`@Input('borderRadius')`	number \| string	'0px'	The wrapper's border radius

Interfaces

N/A

Contribution

For feature request and bug report, visit the issue page.

License

MIT License - Refer to LICENSE.

tslib

@everything-registry/sub-chunk-1140 @zalastax/nolb-angularx

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago