Skip to content

A
alertify-js
Commit 71bb2644 authored by bingchuan's avatar bingchuan
Browse files
Options

Update alertify.css

parent 0c24cb1d
Hide whitespace changes
Inline Side-by-side
Showing with 21 additions and 105 deletions
build/css/alertify.css
View file @ 71bb2644
/** /**
* alertifyjs 1.14.0 http://alertifyjs.com * alertifyjs 1.8.0 http://alertifyjs.com
* AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications. * AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.
* Copyright 2024 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com) * Copyright 2016 Mohammad Younes <Mohammad@alertifyjs.com> (http://alertifyjs.com)
* Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/ * Licensed under GPL 3 <https://opensource.org/licenses/gpl-3.0>*/
.alertify .ajs-dimmer { .alertify .ajs-dimmer {
position: fixed; position: fixed;
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
padding: 0; padding: 0;
margin: 0; margin: 0;
background-color: #252525; background-color: #252525;
opacity: 0.5; opacity: .5;
} }
.alertify .ajs-modal { .alertify .ajs-modal {
position: fixed; position: fixed;
...@@ -312,12 +312,9 @@ ...@@ -312,12 +312,9 @@
.alertify .ajs-modal { .alertify .ajs-modal {
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
-webkit-transition-property: opacity, visibility;
transition-property: opacity, visibility; transition-property: opacity, visibility;
-webkit-transition-timing-function: linear; transition-timing-function: linear;
transition-timing-function: linear; transition-duration: 250ms;
-webkit-transition-duration: 250ms;
transition-duration: 250ms;
} }
.alertify.ajs-hidden .ajs-dimmer, .alertify.ajs-hidden .ajs-dimmer,
.alertify.ajs-hidden .ajs-modal { .alertify.ajs-hidden .ajs-modal {
...@@ -335,8 +332,8 @@ ...@@ -335,8 +332,8 @@
.alertify .ajs-dialog.ajs-shake { .alertify .ajs-dialog.ajs-shake {
-webkit-animation-name: ajs-shake; -webkit-animation-name: ajs-shake;
animation-name: ajs-shake; animation-name: ajs-shake;
-webkit-animation-duration: 0.1s; -webkit-animation-duration: .1s;
animation-duration: 0.1s; animation-duration: .1s;
-webkit-animation-fill-mode: both; -webkit-animation-fill-mode: both;
animation-fill-mode: both; animation-fill-mode: both;
} }
...@@ -443,8 +440,7 @@ ...@@ -443,8 +440,7 @@
60%, 60%,
80%, 80%,
100% { 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
} }
0% { 0% {
opacity: 0; opacity: 0;
...@@ -481,8 +477,7 @@ ...@@ -481,8 +477,7 @@
60%, 60%,
80%, 80%,
100% { 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
} }
0% { 0% {
opacity: 0; opacity: 0;
...@@ -630,15 +625,13 @@ ...@@ -630,15 +625,13 @@
0% { 0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0; opacity: 0;
} }
40% { 40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
} }
60% { 60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
...@@ -658,15 +651,13 @@ ...@@ -658,15 +651,13 @@
0% { 0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0; opacity: 0;
} }
40% { 40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
} }
60% { 60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
...@@ -718,15 +709,13 @@ ...@@ -718,15 +709,13 @@
0% { 0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0; opacity: 0;
} }
40% { 40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
} }
60% { 60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
...@@ -746,15 +735,13 @@ ...@@ -746,15 +735,13 @@
0% { 0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0; opacity: 0;
} }
40% { 40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in; transition-timing-function: ease-in;
transition-timing-function: ease-in;
} }
60% { 60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
...@@ -851,16 +838,12 @@ ...@@ -851,16 +838,12 @@
margin: 0; margin: 0;
-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
-webkit-transition-duration: 250ms; transition-duration: 250ms;
transition-duration: 250ms; transition-timing-function: linear;
-webkit-transition-timing-function: linear;
transition-timing-function: linear;
} }
.alertify-notifier .ajs-message.ajs-visible { .alertify-notifier .ajs-message.ajs-visible {
-webkit-transition-duration: 500ms; transition-duration: 500ms;
transition-duration: 500ms; transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
-webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
opacity: 1; opacity: 1;
max-height: 100%; max-height: 100%;
padding: 15px; padding: 15px;
...@@ -875,19 +858,6 @@ ...@@ -875,19 +858,6 @@
.alertify-notifier .ajs-message.ajs-warning { .alertify-notifier .ajs-message.ajs-warning {
background: rgba(252, 248, 215, 0.95); background: rgba(252, 248, 215, 0.95);
} }
.alertify-notifier .ajs-message .ajs-close {
position: absolute;
top: 0;
right: 0;
width: 16px;
height: 16px;
cursor: pointer;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAABGdBTUEAALGPC/xhBQAAAFBJREFUGBl1j0EKADEIA+ve/P9f9bh1hEihNBfjVCO1v7RKVqJK4h8gM5cAPR42AkQEpSXPwMTyoi13n5N9YqJehm3Fnr7nL1D0ZEbD5OubGyC7a9gx+9eNAAAAAElFTkSuQmCC);
background-repeat: no-repeat;
background-position: center center;
background-color: rgba(0, 0, 0, 0.5);
border-top-right-radius: 2px;
}
.alertify-notifier.ajs-top { .alertify-notifier.ajs-top {
top: 10px; top: 10px;
} }
...@@ -912,57 +882,3 @@ ...@@ -912,57 +882,3 @@
.alertify-notifier.ajs-left .ajs-message.ajs-visible { .alertify-notifier.ajs-left .ajs-message.ajs-visible {
left: 0; left: 0;
} }
.alertify-notifier.ajs-center {
left: 50%;
}
.alertify-notifier.ajs-center .ajs-message {
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.alertify-notifier.ajs-center .ajs-message.ajs-visible {
left: 50%;
-webkit-transition-timing-function: cubic-bezier(0.57, 0.43, 0.1, 0.65);
transition-timing-function: cubic-bezier(0.57, 0.43, 0.1, 0.65);
}
.alertify-notifier.ajs-center.ajs-top .ajs-message {
top: -300px;
}
.alertify-notifier.ajs-center.ajs-top .ajs-message.ajs-visible {
top: 0;
}
.alertify-notifier.ajs-center.ajs-bottom .ajs-message {
bottom: -300px;
}
.alertify-notifier.ajs-center.ajs-bottom .ajs-message.ajs-visible {
bottom: 0;
}
.ajs-no-transition.alertify .ajs-dimmer,
.ajs-no-transition.alertify .ajs-modal,
.ajs-no-transition.alertify .ajs-dialog {
-webkit-transition: none!important;
transition: none!important;
-webkit-animation: none!important;
animation: none!important;
}
.ajs-no-transition.alertify-notifier .ajs-message {
-webkit-transition: none!important;
transition: none!important;
-webkit-animation: none!important;
animation: none!important;
}
@media (prefers-reduced-motion: reduce) {
.alertify .ajs-dimmer,
.alertify .ajs-modal,
.alertify .ajs-dialog {
-webkit-transition: none!important;
transition: none!important;
-webkit-animation: none!important;
animation: none!important;
}
.alertify-notifier .ajs-message {
-webkit-transition: none!important;
transition: none!important;
-webkit-animation: none!important;
animation: none!important;
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment