<div class="row wrapper border-bottom white-bg page-heading">
    <div class="col-lg-10">
        <h2>Sweet Alert</h2>
        <ol class="breadcrumb">
            <li>
                <a href="index.html">Home</a>
            </li>
            <li>
                <a>Miscellaneous</a>
            </li>
            <li class="active">
                <strong>Sweet Alert</strong>
            </li>
        </ol>
    </div>
    <div class="col-lg-2">

    </div>
</div>
<div class="wrapper wrapper-content  animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-title">
                    <h5>Sweet Alert</h5>
                </div>

                <div class="ibox-content">

                    <strong>An awesome replacement for JavaScript's alert.</strong>

                    <p>
                        SweetAlert automatically centers itself on the page and looks great no matter if
                        you're using a desktop computer, mobile or tablet. It's even highly customizeable,
                        as you can see below!
                        <a href="http://t4t5.github.io/sweetalert/" target="_blank">http://t4t5.github.io/sweetalert/</a>

                    </p>

                    <div class="row text-center" ng-controller="sweetAlertCtrl">

                        <div class="col-lg-6 h-100 p-lg">
                            <p>A basic sweetalert message</p>
                            <button class="btn btn-primary btn-sm" ng-click="demo1()">Run example</button>
                        </div>
                        <div class="col-lg-6 h-100 p-lg">
                            <p> A success message! </p>
                            <button class="btn btn-success btn-sm" ng-click="demo2()">Run example</button>
                        </div>
                        <div class="col-lg-6 h-100 p-lg">
                            <p>A warning message, with a function attached to the "Confirm"-button...</p>
                            <button class="btn btn-warning btn-sm" ng-click="demo3()">Run example</button>
                        </div>
                        <div class="col-lg-6 h-100 p-lg">
                            <p> ... and by passing a parameter, you can execute something else for "Cancel". </p>
                            <button class="btn btn-danger btn-sm" ng-click="demo4()">Run example</button>
                        </div>





                    </div>
                    <div class="m-t-md">
                        <p>
                            You can easy add sweet alert in your script:
                        </p>
                    <pre>
SweetAlert.swal({
    title: "Are you sure?",
    text: "Your will not be able to recover this imaginary file!",
    type: "warning",
    showCancelButton: true,
    confirmButtonColor: "#DD6B55",
    confirmButtonText: "Yes, delete it!",
    cancelButtonText: "No, cancel plx!",
    closeOnConfirm: false,
    closeOnCancel: false },
function (isConfirm) {
    if (isConfirm) {
        SweetAlert.swal("Deleted!", "Your imaginary file has been deleted.", "success");
    } else {
        SweetAlert.swal("Cancelled", "Your imaginary file is safe :)", "error");
    }
});</pre>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>