1.5.11 • Published 2 years ago

@corentinmag/ngx-float-button v1.5.11

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

To use this library:

$ npm install @corentinmag/ngx-float-button
$ ng add @angular/material

check demo here

// app.module.ts

import { NgxFloatButtonModule } from '@corentinmag/ngx-float-button';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
...

@NgModule({
    ...,
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        NgxFloatButtonModule
    ]
})
<!-- app.component.html -->
<ngx-float-button>
    <ngx-float-item-button></ngx-float-item-button>
    <ngx-float-item-button></ngx-float-item-button>
    <ngx-float-item-button></ngx-float-item-button>
</ngx-float-button>

Ngx-float-button

List of Inputs

@Inputstypedefaultdescription
direction'top' \| 'left' \| 'right' \| 'bottom'topposition of the child buttons relative to the main button
iconstringhomeshould be a material icon string (https://fonts.google.com/icons)
tooltipstringhomenot used
colorThemePaletteprimarymain button color
position'br' \| 'bl' \| 'tl' \| 'tr'breither the main button is positionned on the bottom-right, bottom-left, top-left or top-right of the viewport
disabledbooleanfalseeither the main button is disabled or not
spaceBetweennumber5the space in pixel between each child button
spaceGapnumber15the space in pixel between the main button and the first child button
isOpenbooleanfalseeither the child buttons should appear at startup
hoverablebooleanfalseeither the user should hover or click the main button to reveal the child buttons
tooltipDisabledbooleanfalseeither tooltip is enabled or not

Ngx-float-item-button

List of Inputs

@Inputstypedefaultdescription
iconstringhomeshould be a material icon string (https://fonts.google.com/icons)
tooltipstringhomethe tooltip text
colorThemePaletteprimarymain button color
disabledbooleanfalseeither the button is disabled or not
tooltipDisabledbooleanfalseeither tooltip is enabled or not
1.5.11

2 years ago

1.5.10

2 years ago

1.5.9

2 years ago

1.5.8

2 years ago

1.5.7

2 years ago

1.5.6

2 years ago

1.5.5

2 years ago

1.5.4

2 years ago

1.5.3

2 years ago

1.5.2

2 years ago

1.5.1

2 years ago

1.5.0

2 years ago

0.0.1

2 years ago

1.3.0

2 years ago

1.2.0

2 years ago

1.1.0

2 years ago

1.0.0

2 years ago