durandal.css 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. /*!
  2. * Durandal 2.1.0 Copyright (c) 2012 Blue Spire Consulting, Inc. All Rights Reserved.
  3. * Available via the MIT license.
  4. * see: http://durandaljs.com or https://github.com/BlueSpire/Durandal for details
  5. */
  6. .modalBlockout {
  7. position: fixed;
  8. top: 0;
  9. left: 0;
  10. width: 100%;
  11. height: 100%;
  12. background: black;
  13. opacity: 0;
  14. pointer-events: auto;
  15. -webkit-backface-visibility: hidden;
  16. -webkit-transition: opacity 0.1s linear;
  17. -moz-transition: opacity 0.1s linear;
  18. -o-transition: opacity 0.1s linear;
  19. transition: opacity 0.1s linear;
  20. }
  21. .modalHost {
  22. top: 50%;
  23. left: 50%;
  24. position: fixed;
  25. opacity: 0;
  26. -webkit-backface-visibility: hidden;
  27. -webkit-transition: opacity 0.1s linear;
  28. -moz-transition: opacity 0.1s linear;
  29. -o-transition: opacity 0.1s linear;
  30. transition: opacity 0.1s linear;
  31. }
  32. .messageBox {
  33. min-width: 300px;
  34. }
  35. .durandal-view-404 {
  36. color: red;
  37. margin: 8px 0;
  38. padding: 8px;
  39. -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  40. -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  41. box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
  42. border: 1px solid #999;
  43. border: 1px solid rgba(0, 0, 0, 0.3);
  44. -webkit-border-radius: 6px;
  45. -moz-border-radius: 6px;
  46. border-radius: 6px;
  47. }
  48. @-webkit-keyframes fadeOut {
  49. 0% {opacity: 1;}
  50. 100% {opacity: 0;}
  51. }
  52. @-moz-keyframes fadeOut {
  53. 0% {opacity: 1;}
  54. 100% {opacity: 0;}
  55. }
  56. @-o-keyframes fadeOut {
  57. 0% {opacity: 1;}
  58. 100% {opacity: 0;}
  59. }
  60. @keyframes fadeOut {
  61. 0% {opacity: 1;}
  62. 100% {opacity: 0;}
  63. }
  64. .entrance-out {
  65. -webkit-animation-fill-mode:both;
  66. -moz-animation-fill-mode:both;
  67. -ms-animation-fill-mode:both;
  68. -o-animation-fill-mode:both;
  69. animation-fill-mode:both;
  70. -webkit-animation-duration:0.1s;
  71. -moz-animation-duration:0.1s;
  72. -ms-animation-duration:0.1s;
  73. -o-animation-duration:0.1s;
  74. animation-duration:0.1s;
  75. -webkit-animation-name: fadeOut;
  76. -moz-animation-name: fadeOut;
  77. -o-animation-name: fadeOut;
  78. animation-name: fadeOut;
  79. }
  80. @-webkit-keyframes slideInRight {
  81. 0% {
  82. opacity: 0;
  83. -webkit-transform: translateX(20px);
  84. }
  85. 100% {
  86. opacity: 1;
  87. -webkit-transform: translateX(0);
  88. }
  89. }
  90. @-moz-keyframes slideInRight {
  91. 0% {
  92. opacity: 0;
  93. -moz-transform: translateX(20px);
  94. }
  95. 100% {
  96. opacity: 1;
  97. -moz-transform: translateX(0);
  98. }
  99. }
  100. @-o-keyframes slideInRight {
  101. 0% {
  102. opacity: 0;
  103. -o-transform: translateX(20px);
  104. }
  105. 100% {
  106. opacity: 1;
  107. -o-transform: translateX(0);
  108. }
  109. }
  110. @keyframes slideInRight {
  111. 0% {
  112. opacity: 0;
  113. transform: translateX(20px);
  114. }
  115. 100% {
  116. opacity: 1;
  117. transform: translateX(0);
  118. }
  119. }
  120. .entrance-in {
  121. -webkit-animation-fill-mode:both;
  122. -moz-animation-fill-mode:both;
  123. -ms-animation-fill-mode:both;
  124. -o-animation-fill-mode:both;
  125. animation-fill-mode:both;
  126. -webkit-animation-duration:0.5s;
  127. -moz-animation-duration:0.5s;
  128. -ms-animation-duration:0.5s;
  129. -o-animation-duration:0.5s;
  130. animation-duration:0.5s;
  131. -webkit-animation-name: slideInRight;
  132. -moz-animation-name: slideInRight;
  133. -o-animation-name: slideInRight;
  134. animation-name: slideInRight;
  135. }
  136. @-webkit-keyframes fadeIn {
  137. 0% {opacity: 0;}
  138. 100% {opacity: 1;}
  139. }
  140. @-moz-keyframes fadeIn {
  141. 0% {opacity: 0;}
  142. 100% {opacity: 1;}
  143. }
  144. @-o-keyframes fadeIn {
  145. 0% {opacity: 0;}
  146. 100% {opacity: 1;}
  147. }
  148. @keyframes fadeIn {
  149. 0% {opacity: 0;}
  150. 100% {opacity: 1;}
  151. }
  152. .entrance-in-fade {
  153. -webkit-animation-fill-mode:both;
  154. -moz-animation-fill-mode:both;
  155. -ms-animation-fill-mode:both;
  156. -o-animation-fill-mode:both;
  157. animation-fill-mode:both;
  158. -webkit-animation-duration:0.5s;
  159. -moz-animation-duration:0.5s;
  160. -ms-animation-duration:0.5s;
  161. -o-animation-duration:0.5s;
  162. animation-duration:0.5s;
  163. -webkit-animation-name: fadeIn;
  164. -moz-animation-name: fadeIn;
  165. -o-animation-name: fadeIn;
  166. animation-name: fadeIn;
  167. }