custom-material-dialog-soloalert

A Customizable Lightweight Alert Library with Material UI | SoloAlert

by

SoloAlert is a lightweight, customizable alert library for creating responsive and beautiful popup tiles (such as alert, confirmation, and prompt tiles) as seen on Google Android or Material Design.

custom material dialog android github, javascript confirm box css design, design confirm box javascript, angular material dialog example, material ui dialog

How to make use of it:

1. Install & download the package with NPM.

# NPM
$ npm i soloalert --save

2. Insert the SoloAlert library into the doc.

<script src="index.js"></script>
<!-- Or From A CDN -->
<script src="https://unpkg.com/soloalert"></script>

3. Create an alert dialog box.

SoloAlert.alert({

  // dialog title
  title: "Title",

  // dialog content
  body: "",

  // success, warning, or, error
  icon: "",

  // or "light", "dark"
  theme: "auto",

  // additional HTML content
  html: "",

  // whether the backdrop backgound is semi-transparent
  useTransparency: false,

  // callback functions
  onOk: function () { },
  
});

4. Create an affirmation dialog box.

SoloAlert.confirm({

  // dialog title
  title: "Title",

  // dialog content
  body: "",

  // or "light", "dark"
  theme: "auto",

  // additional HTML content
  html: "",

  // whether the backdrop backgound is semi-transparent
  useTransparency: false,

  // callback functions
  onOk: function () { },
  onCancel: function () { },

}).then(value => {
  // do something
})

5. Create an immediate dialog box.

SoloAlert.prompt({

  // dialog title
  title: "Title",

  // dialog content
  body: "",

  // max number of characters
  textLimit: 100,

  // or "light", "dark"
  theme: "auto",

  // additional HTML content
  html: "",

  // whether the backdrop backgound is semi-transparent
  useTransparency: false,

  // callback functions
  onOk: function () { },
  onCancel: function () { },
  onInput: function () { },

})

Beautiful Dialog Box Library Inspired By Material Design, SoloAlert Plugin/Github, material ui dialog example, full screen dialog android, angularmaterial confirmation dialog

See Demo And Download

Demo
Download

Official Website(arnav-kr): Click Here

This superior jQuery/javascript plugin is developed by arnav-kr. For extra Advanced Usages, please go to the official website.

Leave a Comment