Git Product home page Git Product logo

sweetalert2's Introduction

SweetAlert2

An awesome replacement for JavaScript's alert.

See it in action!

A success modal

Usage

You can install SweetAlert2 through bower:

bower install sweetalert2

Alternatively, download the package and reference the JavaScript and CSS files manually:

<script src="dist/sweetalert2.min.js"></script>
<link rel="stylesheet" type="text/css" href="dist/sweetalert2.css">

Examples

The most basic message:

swal('Hello world!');

A message signaling an error:

swal('Oops...', 'Something went wrong!', 'error');

A warning message, with a function attached to the "Confirm"-button..

swal({
  title: 'Are you sure?',
  text: 'You will not be able to recover this imaginary file!',
  type: 'warning',
  showCancelButton: true,
  confirmButtonColor: '#dd6b55',
  cancelButtonColor: '#d44',
  confirmButtonText: 'Yes, delete it!',
  cancelButtonText: 'No, keet it',
  closeOnConfirm: false
}, function() {
  swal(
    'Deleted!',
    'Your imaginary file has been deleted.',
    'success'
  );
});

View more examples

Contributing

If you would like to contribute enhancements or fixes, please do the following:

  1. Fork the plugin repository.

  2. Make sure you have Node and NPM installed.

  3. When in the SweetAlert directory, run the command npm install to install npm packages.

  4. Start gulp watcher gulp watch to automatically minify the SCSS and JS-files.

  5. Hack on a separate topic branch created from the latest master.

  6. Commit and push the topic branch.

  7. Make a pull request and wait for approval.

  8. Welcome to the club

Please note that modifications should follow these coding guidelines:

  1. Indent is 2 spaces.

  2. Javascript code should pass jscs and jshint linters with configurations in project repository.

  3. SCSS code should pass scss-lint with configuration in project repository.

  4. Vertical whitespace helps readability, don't be afraid to use it.

Thank you for helping out!

Related projects

sweetalert2's People

Contributors

t4t5 avatar limonte avatar green-arrow avatar sontan avatar nixta avatar connyay avatar lipis avatar holmesal avatar mkoczka avatar zzarcon avatar glennvd avatar 151dd avatar xming13 avatar mizterp avatar sgtlambda avatar panihans avatar tomafc330 avatar theodorejb avatar pomartel avatar peterkos avatar julieng-eec avatar gaugejosh avatar jeffutter avatar aristona avatar alexkvazos avatar

Stargazers

Budi K avatar

Watchers

Budi K avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.