✨ A beautiful, responsive, highly customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes. Zero dependencies. 🇺🇦
MIT License
Bot releases are hidden (Show)
Published by limonte about 4 years ago
For the sake of customization, the loader has been separated from the confirm button into its own DOM element (<div class="swal2-loader"></div>
).
As a part of that breaking change, there's a new API param loaderHtml
which allows to set custom HTML, e.g. SVG icon inside of the loader.
Swal.fire({
title: 'Do you want to save the changes?',
showDenyButton: true,
showCancelButton: true,
confirmButtonText: `Save`,
denyButtonText: `Don't save`,
}).then(function (result) {
console.log(result)
// Object {
// value: false,
// isConfirmed: false,
// isDenied: true,
// isDismissed: false
// }
})
Swal.clickDeny()
showDenyButton?: boolean;
(default false
)denyButtonText?: string;
(default 'No'
)denyButtonColor?: string;
(default undefined
)denyButtonAriaLabel?: string;
(default ''
)focusDeny?: boolean;
(default false
)customClass.denyButton?: string
(default undefined
)Swal.getDenyButton()
Swal.clickDeny()
// ACTIONS
$swal2-actions-padding: 0 1.6em !default;
// DENY BUTTON
$swal2-deny-button-order: null !default;
$swal2-deny-button-border: 0 !default;
$swal2-deny-button-border-radius: .25em !default;
$swal2-deny-button-background-color: #dd6b55 !default;
$swal2-deny-button-color: $swal2-white !default;
$swal2-deny-button-font-size: 1.0625em !default;
// LOADER
$swal2-loader-align-items: center !default;
$swal2-loader-justify-content: center !default;
$swal2-loader-width: 2.2em !default;
$swal2-loader-height: 2.2em !default;
$swal2-loader-margin: 0 1.875em !default;
$swal2-loader-animation: swal2-rotate-loading 1.5s linear 0s infinite normal !default;
$swal2-loader-border-width: .25em !default;
$swal2-loader-border-style: solid !default;
$swal2-loader-border-radius: 100% !default;
$swal2-loader-border-color: #3085d6 transparent #3085d6 transparent !default;
// CONFIRM BUTTON
$swal2-confirm-button-order: null !default;
// CANCEL BUTTON
$swal2-cancel-button-order: null !default;
Published by limonte over 4 years ago