6 changed files with 694 additions and 32 deletions
@ -0,0 +1,26 @@ |
|||
.toast-example { |
|||
position: static !important; |
|||
margin: 10px 0 30px; |
|||
} |
|||
.toast-example.padding-0 { |
|||
margin-bottom: 30px; |
|||
} |
|||
.toast-example > div { |
|||
width: auto; |
|||
padding-top: 10px; |
|||
padding-bottom: 10px; |
|||
margin-bottom: 0; |
|||
} |
|||
.position-example { |
|||
position: relative; |
|||
height: 330px; |
|||
margin-bottom: 20px; |
|||
} |
|||
.position-example > div { |
|||
position: absolute; |
|||
width: 100%; |
|||
padding: 20px; |
|||
} |
|||
.position-example > .btn-block + .btn-block { |
|||
margin-top: 215px; |
|||
} |
@ -0,0 +1,93 @@ |
|||
/*! |
|||
* remark (http://getbootstrapadmin.com/remark)
|
|||
* Copyright 2016 amazingsurge |
|||
* Licensed under the Themeforest Standard Licenses |
|||
*/ |
|||
$.components.register("alertify", { |
|||
mode: "api", |
|||
defaults: { |
|||
type: "alert", |
|||
delay: 5000, |
|||
theme: 'bootstrap' |
|||
}, |
|||
api: function() { |
|||
if (typeof alertify === "undefined") return; |
|||
|
|||
var defaults = $.components.getDefaults("alertify"); |
|||
|
|||
$(document).on('click.site.alertify', '[data-plugin="alertify"]', function() { |
|||
var $this = $(this), |
|||
options = $.extend(true, {}, defaults, $this.data()); |
|||
|
|||
if (options.labelOk) { |
|||
options.okBtn = options.labelOk; |
|||
} |
|||
|
|||
if (options.labelCancel) { |
|||
options.cancelBtn = options.labelCancel; |
|||
} |
|||
|
|||
if (typeof options.delay !== 'undefined') { |
|||
alertify.delay(options.delay); |
|||
} |
|||
|
|||
if (typeof options.theme !== 'undefined') { |
|||
alertify.theme(options.theme); |
|||
} |
|||
|
|||
if (typeof options.cancelBtn !== 'undefined') { |
|||
alertify.cancelBtn(options.cancelBtn); |
|||
} |
|||
|
|||
if (typeof options.okBtn !== 'undefined') { |
|||
alertify.okBtn(options.okBtn); |
|||
} |
|||
|
|||
if (typeof options.placeholder !== 'undefined') { |
|||
alertify.delay(options.placeholder); |
|||
} |
|||
|
|||
if (typeof options.defaultValue !== 'undefined') { |
|||
alertify.delay(options.defaultValue); |
|||
} |
|||
|
|||
if (typeof options.maxLogItems !== 'undefined') { |
|||
alertify.delay(options.maxLogItems); |
|||
} |
|||
|
|||
if (typeof options.closeLogOnClick !== 'undefined') { |
|||
alertify.delay(options.closeLogOnClick); |
|||
} |
|||
|
|||
switch (options.type) { |
|||
case "alert": |
|||
alertify.alert(options.alertMessage); |
|||
break; |
|||
case "confirm": |
|||
alertify.confirm(options.confirmTitle, function() { |
|||
alertify.success(options.successMessage); |
|||
}, function() { |
|||
alertify.error(options.errorMessage); |
|||
}); |
|||
break; |
|||
case "prompt": |
|||
alertify.prompt(options.promptTitle, function(str, ev) { |
|||
var message = options.successMessage.replace('%s', str); |
|||
alertify.success(message); |
|||
}, function(ev) { |
|||
alertify.error(options.errorMessage); |
|||
}); |
|||
break; |
|||
case "log": |
|||
alertify.log(options.logMessage); |
|||
break; |
|||
case "success": |
|||
alertify.success(options.successMessage); |
|||
break; |
|||
case "error": |
|||
alertify.error(options.errorMessage); |
|||
break; |
|||
} |
|||
}); |
|||
} |
|||
}); |
@ -0,0 +1,524 @@ |
|||
(function() { |
|||
|
|||
"use strict"; |
|||
|
|||
var TRANSITION_FALLBACK_DURATION = 500; |
|||
var hideElement = function(el) { |
|||
|
|||
if (! el) { |
|||
return; |
|||
} |
|||
|
|||
var removeThis = function() { |
|||
if (el && el.parentNode) { |
|||
el.parentNode.removeChild(el); |
|||
} |
|||
}; |
|||
|
|||
el.classList.remove("show"); |
|||
el.classList.add("hide"); |
|||
el.addEventListener("transitionend", removeThis); |
|||
|
|||
// Fallback for no transitions.
|
|||
setTimeout(removeThis, TRANSITION_FALLBACK_DURATION); |
|||
|
|||
}; |
|||
|
|||
function Alertify() { |
|||
|
|||
/** |
|||
* Alertify private object |
|||
* @type {Object} |
|||
*/ |
|||
var _alertify = { |
|||
|
|||
parent: document.body, |
|||
version: "1.0.10", |
|||
defaultOkLabel: "Ok", |
|||
okLabel: "Ok", |
|||
defaultCancelLabel: "Cancel", |
|||
cancelLabel: "Cancel", |
|||
defaultMaxLogItems: 2, |
|||
maxLogItems: 2, |
|||
promptValue: "", |
|||
promptPlaceholder: "", |
|||
closeLogOnClick: false, |
|||
closeLogOnClickDefault: false, |
|||
delay: 5000, |
|||
defaultDelay: 5000, |
|||
logContainerClass: "alertify-logs", |
|||
logContainerDefaultClass: "alertify-logs", |
|||
dialogs: { |
|||
buttons: { |
|||
holder: "<nav>{{buttons}}</nav>", |
|||
ok: "<button class='ok' tabindex='1'>{{ok}}</button>", |
|||
cancel: "<button class='cancel' tabindex='2'>{{cancel}}</button>" |
|||
}, |
|||
input: "<input type='text'>", |
|||
message: "<p class='msg'>{{message}}</p>", |
|||
log: "<div class='{{class}}'>{{message}}</div>" |
|||
}, |
|||
|
|||
defaultDialogs: { |
|||
buttons: { |
|||
holder: "<nav>{{buttons}}</nav>", |
|||
ok: "<button class='ok' tabindex='1'>{{ok}}</button>", |
|||
cancel: "<button class='cancel' tabindex='2'>{{cancel}}</button>" |
|||
}, |
|||
input: "<input type='text'>", |
|||
message: "<p class='msg'>{{message}}</p>", |
|||
log: "<div class='{{class}}'>{{message}}</div>" |
|||
}, |
|||
|
|||
/** |
|||
* Build the proper message box |
|||
* |
|||
* @param {Object} item Current object in the queue |
|||
* |
|||
* @return {String} An HTML string of the message box |
|||
*/ |
|||
build: function(item) { |
|||
|
|||
var btnTxt = this.dialogs.buttons.ok; |
|||
var html = "<div class='dialog'>" + "<div>" + this.dialogs.message.replace("{{message}}", item.message); |
|||
|
|||
if(item.type === "confirm" || item.type === "prompt") { |
|||
btnTxt = this.dialogs.buttons.cancel + this.dialogs.buttons.ok; |
|||
} |
|||
|
|||
if (item.type === "prompt") { |
|||
html += this.dialogs.input; |
|||
} |
|||
|
|||
html = (html + this.dialogs.buttons.holder + "</div>" + "</div>") |
|||
.replace("{{buttons}}", btnTxt) |
|||
.replace("{{ok}}", this.okLabel) |
|||
.replace("{{cancel}}", this.cancelLabel); |
|||
|
|||
return html; |
|||
|
|||
}, |
|||
|
|||
setCloseLogOnClick: function(bool) { |
|||
this.closeLogOnClick = !! bool; |
|||
}, |
|||
|
|||
/** |
|||
* Close the log messages |
|||
* |
|||
* @param {Object} elem HTML Element of log message to close |
|||
* @param {Number} wait [optional] Time (in ms) to wait before automatically hiding the message, if 0 never hide |
|||
* |
|||
* @return {undefined} |
|||
*/ |
|||
close: function(elem, wait) { |
|||
|
|||
if (this.closeLogOnClick) { |
|||
elem.addEventListener("click", function(ev) { |
|||
hideElement(ev.srcElement); |
|||
}); |
|||
} |
|||
|
|||
wait = wait && !isNaN(+wait) ? +wait : this.delay; |
|||
|
|||
if (wait < 0) { |
|||
hideElement(elem); |
|||
} else if(wait > 0) { |
|||
setTimeout(function() { |
|||
hideElement(elem); |
|||
}, wait); |
|||
} |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* Create a dialog box |
|||
* |
|||
* @param {String} message The message passed from the callee |
|||
* @param {String} type Type of dialog to create |
|||
* @param {Function} onOkay [Optional] Callback function when clicked okay. |
|||
* @param {Function} onCancel [Optional] Callback function when cancelled. |
|||
* |
|||
* @return {Object} |
|||
*/ |
|||
dialog: function(message, type, onOkay, onCancel) { |
|||
return this.setup({ |
|||
type: type, |
|||
message: message, |
|||
onOkay: onOkay, |
|||
onCancel: onCancel |
|||
}); |
|||
}, |
|||
|
|||
/** |
|||
* Show a new log message box |
|||
* |
|||
* @param {String} message The message passed from the callee |
|||
* @param {String} type [Optional] Optional type of log message |
|||
* @param {Number} wait [Optional] Time (in ms) to wait before auto-hiding the log |
|||
* |
|||
* @return {Object} |
|||
*/ |
|||
log: function(message, type, click) { |
|||
|
|||
var existing = document.querySelectorAll(".alertify-logs > div"); |
|||
if (existing) { |
|||
var diff = existing.length - this.maxLogItems; |
|||
if (diff >= 0) { |
|||
for (var i = 0, _i = diff + 1; i < _i; i++) { |
|||
this.close(existing[i], -1); |
|||
} |
|||
} |
|||
} |
|||
|
|||
this.notify(message, type, click); |
|||
}, |
|||
|
|||
setLogPosition: function(str) { |
|||
this.logContainerClass = "alertify-logs " + str; |
|||
}, |
|||
|
|||
setupLogContainer: function() { |
|||
|
|||
var elLog = document.querySelector(".alertify-logs"); |
|||
var className = this.logContainerClass; |
|||
if (! elLog) { |
|||
elLog = document.createElement("div"); |
|||
elLog.className = className; |
|||
this.parent.appendChild(elLog); |
|||
} |
|||
|
|||
// Make sure it's positioned properly.
|
|||
if (elLog.className !== className) { |
|||
elLog.className = className; |
|||
} |
|||
|
|||
return elLog; |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* Add new log message |
|||
* If a type is passed, a class name "{type}" will get added. |
|||
* This allows for custom look and feel for various types of notifications. |
|||
* |
|||
* @param {String} message The message passed from the callee |
|||
* @param {String} type [Optional] Type of log message |
|||
* @param {Number} wait [Optional] Time (in ms) to wait before auto-hiding |
|||
* |
|||
* @return {undefined} |
|||
*/ |
|||
notify: function(message, type, click) { |
|||
|
|||
var elLog = this.setupLogContainer(); |
|||
var log = document.createElement("div"); |
|||
|
|||
log.className = (type || "default"); |
|||
if (_alertify.logTemplateMethod) { |
|||
log.innerHTML = _alertify.logTemplateMethod(message); |
|||
} else { |
|||
log.innerHTML = message; |
|||
} |
|||
|
|||
// Add the click handler, if specified.
|
|||
if ("function" === typeof click) { |
|||
log.addEventListener("click", click); |
|||
} |
|||
|
|||
elLog.appendChild(log); |
|||
setTimeout(function() { |
|||
log.className += " show"; |
|||
}, 10); |
|||
|
|||
this.close(log, this.delay); |
|||
|
|||
}, |
|||
|
|||
/** |
|||
* Initiate all the required pieces for the dialog box |
|||
* |
|||
* @return {undefined} |
|||
*/ |
|||
setup: function(item) { |
|||
|
|||
var el = document.createElement("div"); |
|||
el.className = "alertify hide"; |
|||
el.innerHTML = this.build(item); |
|||
|
|||
var btnOK = el.querySelector(".ok"); |
|||
var btnCancel = el.querySelector(".cancel"); |
|||
var input = el.querySelector("input"); |
|||
var label = el.querySelector("label"); |
|||
|
|||
// Set default value/placeholder of input
|
|||
if (input) { |
|||
if (typeof this.promptPlaceholder === "string") { |
|||
// Set the label, if available, for MDL, etc.
|
|||
if (label) { |
|||
label.textContent = this.promptPlaceholder; |
|||
} else { |
|||
input.placeholder = this.promptPlaceholder; |
|||
} |
|||
} |
|||
if (typeof this.promptValue === "string") { |
|||
input.value = this.promptValue; |
|||
} |
|||
} |
|||
|
|||
function setupHandlers(resolve) { |
|||
if ("function" !== typeof resolve) { |
|||
// promises are not available so resolve is a no-op
|
|||
resolve = function () {}; |
|||
} |
|||
|
|||
if (btnOK) { |
|||
btnOK.addEventListener("click", function(ev) { |
|||
if (item.onOkay && "function" === typeof item.onOkay) { |
|||
if (input) { |
|||
item.onOkay(input.value, ev); |
|||
} else { |
|||
item.onOkay(ev); |
|||
} |
|||
} |
|||
|
|||
if (input) { |
|||
resolve({ |
|||
buttonClicked: "ok", |
|||
inputValue: input.value, |
|||
event: ev |
|||
}); |
|||
} else { |
|||
resolve({ |
|||
buttonClicked: "ok", |
|||
event: ev |
|||
}); |
|||
} |
|||
|
|||
hideElement(el); |
|||
}); |
|||
} |
|||
|
|||
if (btnCancel) { |
|||
btnCancel.addEventListener("click", function(ev) { |
|||
if (item.onCancel && "function" === typeof item.onCancel) { |
|||
item.onCancel(ev); |
|||
} |
|||
|
|||
resolve({ |
|||
buttonClicked: "cancel", |
|||
event: ev |
|||
}); |
|||
|
|||
hideElement(el); |
|||
}); |
|||
} |
|||
} |
|||
|
|||
var promise; |
|||
|
|||
if (typeof Promise === "function") { |
|||
promise = new Promise(setupHandlers); |
|||
} else { |
|||
setupHandlers(); |
|||
} |
|||
|
|||
this.parent.appendChild(el); |
|||
setTimeout(function() { |
|||
el.classList.remove("hide"); |
|||
if(input && item.type && item.type === "prompt") { |
|||
input.select(); |
|||
input.focus(); |
|||
} else { |
|||
if (btnOK) { |
|||
btnOK.focus(); |
|||
} |
|||
} |
|||
}, 100); |
|||
|
|||
return promise; |
|||
}, |
|||
|
|||
okBtn: function(label) { |
|||
this.okLabel = label; |
|||
return this; |
|||
}, |
|||
|
|||
setDelay: function(time) { |
|||
time = time || 0; |
|||
this.delay = isNaN(time) ? this.defaultDelay : parseInt(time, 10); |
|||
return this; |
|||
}, |
|||
|
|||
cancelBtn: function(str) { |
|||
this.cancelLabel = str; |
|||
return this; |
|||
}, |
|||
|
|||
setMaxLogItems: function(num) { |
|||
this.maxLogItems = parseInt(num || this.defaultMaxLogItems); |
|||
}, |
|||
|
|||
theme: function(themeStr) { |
|||
switch(themeStr.toLowerCase()) { |
|||
case "bootstrap": |
|||
this.dialogs.buttons.ok = "<button class='ok btn btn-primary' tabindex='1'>{{ok}}</button>"; |
|||
this.dialogs.buttons.cancel = "<button class='cancel btn btn-default' tabindex='2'>{{cancel}}</button>"; |
|||
this.dialogs.input = "<input type='text' class='form-control'>"; |
|||
break; |
|||
case "purecss": |
|||
this.dialogs.buttons.ok = "<button class='ok pure-button' tabindex='1'>{{ok}}</button>"; |
|||
this.dialogs.buttons.cancel = "<button class='cancel pure-button' tabindex='2'>{{cancel}}</button>"; |
|||
break; |
|||
case "mdl": |
|||
case "material-design-light": |
|||
this.dialogs.buttons.ok = "<button class='ok mdl-button mdl-js-button mdl-js-ripple-effect' tabindex='1'>{{ok}}</button>"; |
|||
this.dialogs.buttons.cancel = "<button class='cancel mdl-button mdl-js-button mdl-js-ripple-effect' tabindex='2'>{{cancel}}</button>"; |
|||
this.dialogs.input = "<div class='mdl-textfield mdl-js-textfield'><input class='mdl-textfield__input'><label class='md-textfield__label'></label></div>"; |
|||
break; |
|||
case "angular-material": |
|||
this.dialogs.buttons.ok = "<button class='ok md-primary md-button' tabindex='1'>{{ok}}</button>"; |
|||
this.dialogs.buttons.cancel = "<button class='cancel md-button' tabindex='2'>{{cancel}}</button>"; |
|||
this.dialogs.input = "<div layout='column'><md-input-container md-no-float><input type='text'></md-input-container></div>"; |
|||
break; |
|||
case "default": |
|||
default: |
|||
this.dialogs.buttons.ok = this.defaultDialogs.buttons.ok; |
|||
this.dialogs.buttons.cancel = this.defaultDialogs.buttons.cancel; |
|||
this.dialogs.input = this.defaultDialogs.input; |
|||
break; |
|||
} |
|||
}, |
|||
|
|||
reset: function() { |
|||
this.parent = document.body; |
|||
this.theme("default"); |
|||
this.okBtn(this.defaultOkLabel); |
|||
this.cancelBtn(this.defaultCancelLabel); |
|||
this.setMaxLogItems(); |
|||
this.promptValue = ""; |
|||
this.promptPlaceholder = ""; |
|||
this.delay = this.defaultDelay; |
|||
this.setCloseLogOnClick(this.closeLogOnClickDefault); |
|||
this.setLogPosition("bottom left"); |
|||
this.logTemplateMethod = null; |
|||
}, |
|||
|
|||
injectCSS: function() { |
|||
if (!document.querySelector("#alertifyCSS")) { |
|||
var head = document.getElementsByTagName("head")[0]; |
|||
var css = document.createElement("style"); |
|||
css.type = "text/css"; |
|||
css.id = "alertifyCSS"; |
|||
css.innerHTML = "/* style.css */"; |
|||
head.insertBefore(css, head.firstChild); |
|||
} |
|||
}, |
|||
|
|||
removeCSS: function() { |
|||
var css = document.querySelector("#alertifyCSS"); |
|||
if (css && css.parentNode) { |
|||
css.parentNode.removeChild(css); |
|||
} |
|||
} |
|||
|
|||
}; |
|||
|
|||
_alertify.injectCSS(); |
|||
|
|||
return { |
|||
_$$alertify: _alertify, |
|||
parent: function(elem) { |
|||
_alertify.parent = elem; |
|||
}, |
|||
reset: function() { |
|||
_alertify.reset(); |
|||
return this; |
|||
}, |
|||
alert: function(message, onOkay, onCancel) { |
|||
return _alertify.dialog(message, "alert", onOkay, onCancel) || this; |
|||
}, |
|||
confirm: function(message, onOkay, onCancel) { |
|||
return _alertify.dialog(message, "confirm", onOkay, onCancel) || this; |
|||
}, |
|||
prompt: function(message, onOkay, onCancel) { |
|||
return _alertify.dialog(message, "prompt", onOkay, onCancel) || this; |
|||
}, |
|||
log: function(message, click) { |
|||
_alertify.log(message, "default", click); |
|||
return this; |
|||
}, |
|||
theme: function(themeStr) { |
|||
_alertify.theme(themeStr); |
|||
return this; |
|||
}, |
|||
success: function(message, click) { |
|||
_alertify.log(message, "success", click); |
|||
return this; |
|||
}, |
|||
error: function(message, click) { |
|||
_alertify.log(message, "error", click); |
|||
return this; |
|||
}, |
|||
cancelBtn: function(label) { |
|||
_alertify.cancelBtn(label); |
|||
return this; |
|||
}, |
|||
okBtn: function(label) { |
|||
_alertify.okBtn(label); |
|||
return this; |
|||
}, |
|||
delay: function(time) { |
|||
_alertify.setDelay(time); |
|||
return this; |
|||
}, |
|||
placeholder: function(str) { |
|||
_alertify.promptPlaceholder = str; |
|||
return this; |
|||
}, |
|||
defaultValue: function(str) { |
|||
_alertify.promptValue = str; |
|||
return this; |
|||
}, |
|||
maxLogItems: function(num) { |
|||
_alertify.setMaxLogItems(num); |
|||
return this; |
|||
}, |
|||
closeLogOnClick: function(bool) { |
|||
_alertify.setCloseLogOnClick(!! bool); |
|||
return this; |
|||
}, |
|||
logPosition: function(str) { |
|||
_alertify.setLogPosition(str || ""); |
|||
return this; |
|||
}, |
|||
setLogTemplate: function(templateMethod) { |
|||
_alertify.logTemplateMethod = templateMethod; |
|||
return this; |
|||
}, |
|||
clearLogs: function() { |
|||
_alertify.setupLogContainer().innerHTML = ""; |
|||
return this; |
|||
}, |
|||
version: _alertify.version |
|||
}; |
|||
} |
|||
|
|||
// AMD, window, and NPM support
|
|||
if ("undefined" !== typeof module && !! module && !! module.exports) { |
|||
// Preserve backwards compatibility
|
|||
module.exports = function() { |
|||
return new Alertify(); |
|||
}; |
|||
var obj = new Alertify(); |
|||
for (var key in obj) { |
|||
module.exports[key] = obj[key]; |
|||
} |
|||
} else if (typeof define === "function" && define.amd) { |
|||
define(function() { |
|||
return new Alertify(); |
|||
}); |
|||
} else { |
|||
window.alertify = new Alertify(); |
|||
} |
|||
|
|||
}()); |
@ -0,0 +1 @@ |
|||
.alertify-logs>*{padding:12px 24px;color:#fff;border-radius:4px;-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,.1);box-shadow:0 1px 4px 0 rgba(0,0,0,.1)}.alertify-logs>*,.alertify-logs>.default{background:rgba(0,0,0,.8)}.alertify-logs>.error{background:#f44336}.alertify-logs>.success{background:#4caf50}.alertify{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1700;width:100%;height:100%;background-color:rgba(0,0,0,.3)}.alertify.hide{pointer-events:none;opacity:0}.alertify,.alertify.hide,.alertify.show{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all .33s cubic-bezier(.25,.8,.25,1);-o-transition:all .33s cubic-bezier(.25,.8,.25,1);transition:all .33s cubic-bezier(.25,.8,.25,1)}.alertify,.alertify *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.alertify .dialog{padding:12px}.alertify .alert,.alertify .dialog{position:relative;top:50%;width:100%;margin:0 auto;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%)}.alertify .alert>*,.alertify .dialog>*{width:400px;max-width:95%;padding:12px;margin:0 auto;text-align:center;background:#fff;border-radius:4px;-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 2px 4px -1px rgba(0,0,0,.14),0 4px 5px 0 rgba(0,0,0,.098),0 1px 10px 0 rgba(0,0,0,.084);box-shadow:0 1px 4px 0 rgba(0,0,0,.1);box-shadow:0 2px 4px -1px rgba(0,0,0,.14),0 4px 5px 0 rgba(0,0,0,.098),0 1px 10px 0 rgba(0,0,0,.084)}.alertify .alert .msg,.alertify .dialog .msg{padding:12px;margin:0;margin-bottom:12px;text-align:left}.alertify .alert input,.alertify .dialog input{width:100%;height:36px;padding:6px 15px;margin-bottom:15px;font-size:14px;line-height:1.57142857;color:#757575;background-color:#fff;background-image:none;border:1px solid #e0e0e0;border-radius:3px;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:-webkit-box-shadow .25s linear,border .25s linear,color .25s linear,background-color .25s linear;-o-transition:box-shadow .25s linear,border .25s linear,color .25s linear,background-color .25s linear;transition:box-shadow .25s linear,border .25s linear,color .25s linear,background-color .25s linear}.alertify .alert input:focus,.alertify .dialog input:focus{border-color:#3f51b5;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(63,81,181,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(63,81,181,.6)}.alertify .alert input.focus,.alertify .alert input:focus,.alertify .dialog input.focus,.alertify .dialog input:focus{border-color:#3f51b5;-webkit-box-shadow:none;box-shadow:none}.alertify .alert input::-moz-placeholder,.alertify .dialog input::-moz-placeholder{color:#9e9e9e;opacity:1}.alertify .alert input:-ms-input-placeholder,.alertify .dialog input:-ms-input-placeholder{color:#9e9e9e}.alertify .alert input::-webkit-input-placeholder,.alertify .dialog input::-webkit-input-placeholder{color:#9e9e9e}.alertify .alert nav,.alertify .dialog nav{text-align:right}.alertify .alert nav .btn,.alertify .dialog nav .btn{margin:4px 5px}.alertify-logs{position:fixed;right:16px;bottom:16px;z-index:1699}.alertify-logs>*{position:relative;float:right;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-top:10px;clear:both;-webkit-transition:all .3s cubic-bezier(.25,.8,.25,1);-o-transition:all .3s cubic-bezier(.25,.8,.25,1);transition:all .3s cubic-bezier(.25,.8,.25,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;perspective:1000}.alertify-logs>.show{right:0;opacity:1}.alertify-logs>*,.alertify-logs>.hide{right:-100%;opacity:0} |
Loading…
Reference in new issue