Lightbox

Installation

NPM

npm i ng-gallery @angular/cdk

Usage

• Import the CDK overlay-prebuilt CSS file in your global styles.

@import '~@angular/cdk/overlay-prebuilt.css';

If you're already using Material, you can skip importing the prebuilt overlay styles.

• For lightbox usage, see Lightbox Usage | Lightbox Usage Demo.
• For gallerize usage, see Gallerize usage | Gallerize Usage Demo.

Global Configuration

To set global configuration that applies on all lightbox overlays across the app, set the config value using LIGHTBOX_CONFIG token

Example:

import { LIGHTBOX_CONFIG, LightboxConfig } from 'ng-gallery/lightbox';

bootstrapApplication(AppComponent, {
  providers: [
    {
      provide: LIGHTBOX_CONFIG,
      useValue: {
        keyboardShortcuts: false,
        exitAnimationTime: 1000
      } as LightboxConfig
    }
  ]
})