2.0.0-beta6 • Published 2 months ago

ad-library v2.0.0-beta6

Weekly downloads
42
License
-
Repository
-
Last release
2 months ago

AD Library

website

Simple angular library :

  • Button slide : show simple icon, on hover : show icon + text
  • Button switch : ios like button switch

Using ad-library in a project

  1. Install the library : npm i ad-library
  2. Import the module :
import { AdLibraryModule } from 'ad-library';
@NgModule({
imports: [ ..., AdLibraryModule ], ...
  1. (if you want to use TabsComponent) Import the module :
import { AdTabsModule } from 'ad-library';
@NgModule({
imports: [ ..., AdTabsModule ], ...
  1. (optional) import an icon library like fontawesome (npm i @fortawesome/fontawesome-free)
  2. Play with the component :-)

<ad-button-slide icon="fas fa-trash" label="Delete this" background="red"></ad-button-slide>

Properties

Button Slide

  • ad-button-slide - (AdButtonSlideComponent) - button slide component object.

Parameters supported by this object:

  • icon: string; - icon class, eg. 'fa fa-trash'
  • label: string; - label displayed on hover
  • background: string = '#aaa'; - css background color
  • foreground: string = 'white'; - css font color
  • backgroundOver: string = null; - css background color when mouseOver, if no value given : backgroundOver = background
  • foregroundOver: string = null; - css font color when mouseOver, if no value given : foregroundOver = foreground
  • mini: boolean = false; - boolean to make the button tiny

Button Switch

  • ad-button-switch - (AdButtonSwitchComponent) - ios like button switch component object.

Parameters supported by this object:

  • theme: string = 'flip'; - choose the button switch theme, can be flip or switch
  • labelOn: string = ''; - for theme flip : label displayed when selected
  • labelOff: string = ''; - for theme flip : label displayed when not selected
  • iconOn: string = ''; - for theme flip : icon displayed when selected
  • iconOff: string = ''; - for theme flip : icon displayed when selected
  • ngModel: value to bind

Example

Tabs

  • ad-tabs-component - (AdTabsComponent) - responsive tabs.

Test library

clone this project and run 'npm i && npm start'

License

MIT License

Author

Adrien Dessilly

2.0.0-beta5

2 months ago

2.0.0-beta6

2 months ago

2.0.0-beta3

2 months ago

2.0.0-beta4

2 months ago

2.0.0-beta2

2 months ago

2.0.0-beta

2 months ago

1.5.0

4 months ago

1.4.0

12 months ago

1.3.1

1 year ago

1.3.0

1 year ago

1.2.0

1 year ago

1.1.1

2 years ago

1.1.0

2 years ago

1.0.0

2 years ago

0.12.1

2 years ago

0.12.2

2 years ago

0.12.0

3 years ago

0.11.0

3 years ago

0.8.0

3 years ago

0.7.0

3 years ago

0.5.0

4 years ago

0.4.0

5 years ago

0.3.1

5 years ago

0.3.0

5 years ago

0.2.0

5 years ago

0.1.2

5 years ago

0.1.1

5 years ago

0.1.0

5 years ago

0.0.10

5 years ago

0.0.9

5 years ago

0.0.8

5 years ago