alertify.core.css 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
  1. .alertify,
  2. .alertify-show,
  3. .alertify-log {
  4. -webkit-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
  5. -moz-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
  6. -ms-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
  7. -o-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
  8. transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275); /* easeOutBack */
  9. }
  10. .alertify-hide {
  11. -webkit-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  12. -moz-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  13. -ms-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  14. -o-transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  15. transition: all 250ms cubic-bezier(0.600, -0.280, 0.735, 0.045); /* easeInBack */
  16. }
  17. .alertify-log-hide {
  18. -webkit-transition: all 500ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  19. -moz-transition: all 500ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  20. -ms-transition: all 500ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  21. -o-transition: all 500ms cubic-bezier(0.600, -0.280, 0.735, 0.045);
  22. transition: all 500ms cubic-bezier(0.600, -0.280, 0.735, 0.045); /* easeInBack */
  23. }
  24. .alertify-cover {
  25. position: fixed; z-index: 99999;
  26. top: 0; right: 0; bottom: 0; left: 0;
  27. background-color:white;
  28. filter:alpha(opacity=0);
  29. opacity:0;
  30. }
  31. .alertify-cover-hidden {
  32. display: none;
  33. }
  34. .alertify {
  35. position: fixed; z-index: 99999;
  36. top: 50px; left: 50%;
  37. width: 550px;
  38. margin-left: -275px;
  39. opacity: 1;
  40. }
  41. .alertify-hidden {
  42. -webkit-transform: translate(0,-150px);
  43. -moz-transform: translate(0,-150px);
  44. -ms-transform: translate(0,-150px);
  45. -o-transform: translate(0,-150px);
  46. transform: translate(0,-150px);
  47. opacity: 0;
  48. display: none;
  49. }
  50. /* overwrite display: none; for everything except IE6-8 */
  51. :root *> .alertify-hidden {
  52. display: block;
  53. visibility: hidden;
  54. }
  55. .alertify-logs {
  56. position: fixed;
  57. z-index: 5000;
  58. bottom: 10px;
  59. right: 10px;
  60. width: 300px;
  61. }
  62. .alertify-logs-hidden {
  63. display: none;
  64. }
  65. .alertify-log {
  66. display: block;
  67. margin-top: 10px;
  68. position: relative;
  69. right: -300px;
  70. opacity: 0;
  71. }
  72. .alertify-log-show {
  73. right: 0;
  74. opacity: 1;
  75. }
  76. .alertify-log-hide {
  77. -webkit-transform: translate(300px, 0);
  78. -moz-transform: translate(300px, 0);
  79. -ms-transform: translate(300px, 0);
  80. -o-transform: translate(300px, 0);
  81. transform: translate(300px, 0);
  82. opacity: 0;
  83. }
  84. .alertify-dialog {
  85. padding: 25px;
  86. }
  87. .alertify-resetFocus {
  88. border: 0;
  89. clip: rect(0 0 0 0);
  90. height: 1px;
  91. margin: -1px;
  92. overflow: hidden;
  93. padding: 0;
  94. position: absolute;
  95. width: 1px;
  96. }
  97. .alertify-inner {
  98. text-align: center;
  99. }
  100. .alertify-text {
  101. margin-bottom: 15px;
  102. width: 100%;
  103. -webkit-box-sizing: border-box;
  104. -moz-box-sizing: border-box;
  105. box-sizing: border-box;
  106. font-size: 100%;
  107. }
  108. .alertify-buttons {
  109. }
  110. .alertify-button,
  111. .alertify-button:hover,
  112. .alertify-button:active,
  113. .alertify-button:visited {
  114. background: none;
  115. text-decoration: none;
  116. border: none;
  117. /* line-height and font-size for input button */
  118. line-height: 1.5;
  119. font-size: 100%;
  120. display: inline-block;
  121. cursor: pointer;
  122. margin-left: 5px;
  123. }
  124. @media only screen and (max-width: 680px) {
  125. .alertify,
  126. .alertify-logs {
  127. width: 90%;
  128. -webkit-box-sizing: border-box;
  129. -moz-box-sizing: border-box;
  130. box-sizing: border-box;
  131. }
  132. .alertify {
  133. left: 5%;
  134. margin: 0;
  135. }
  136. }