RYZE Digital Dialog

Install

npm i @ryze-digital/dialog

Usage

Scss

@use "@ryze-digital/dialog";

Use the provided configure mixin to define your dialog defaults. A complete list of all possible configurations can be found in /src/styles/_config.scss.

@include dialog.configure(...);

Add familiar styles to get a typical dialog look using base mixin. Use the clone-modal-style mixin to make the modal dialog look the same as the non-modal.

dialog {
    @include dialog.base();
    @include dialog.clone-modal-style();
}

JavaScript

import { Dialog } from '@ryze-digital/dialog';

new Dialog({...}).init();

Demos

Checkout this repository and use the /demos folder as document root to see a running demo in the browser.

• Basic use case
• Multiple instances
• Event binding
• Confirmation
• Auto open
• Custom animation
• Fetch content
• Multiple triggers