You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

258 lines
5.5 KiB

  1. .ui.reveal {
  2. display: inline-block;
  3. position: relative!important;
  4. z-index: 2!important;
  5. font-size: 0!important;
  6. }
  7. .ui.reveal>.content {
  8. font-size: 1rem!important;
  9. }
  10. .ui.reveal>.visible.content {
  11. -webkit-transition: all .8s cubic-bezier(0.175,.885,.32,1) .15s;
  12. transition: all .8s cubic-bezier(0.175,.885,.32,1) .15s;
  13. }
  14. .ui.reveal>.visible.content {
  15. position: absolute!important;
  16. top: 0!important;
  17. right: 0!important;
  18. z-index: 4!important;
  19. -webkit-transition: all .8s cubic-bezier(0.175,.885,.32,1) .15s;
  20. transition: all .8s cubic-bezier(0.175,.885,.32,1) .15s;
  21. }
  22. .ui.reveal>.hidden.content {
  23. position: relative!important;
  24. z-index: 3!important;
  25. }
  26. .ui.reveal.button {
  27. overflow: hidden;
  28. }
  29. .ui.slide.reveal {
  30. position: relative!important;
  31. display: block;
  32. overflow: hidden!important;
  33. white-space: nowrap;
  34. }
  35. .ui.slide.reveal>.content {
  36. display: block;
  37. float: right;
  38. -moz-box-sizing: border-box;
  39. -ms-box-sizing: border-box;
  40. box-sizing: border-box;
  41. margin: 0;
  42. -webkit-transition: top .8s cubic-bezier(0.175,.885,.32,1) .15s,right .8s cubic-bezier(0.175,.885,.32,1) .15s,left .8s cubic-bezier(0.175,.885,.32,1) .15s,bottom .8s cubic-bezier(0.175,.885,.32,1) .15s;
  43. transition: top .8s cubic-bezier(0.175,.885,.32,1) .15s,right .8s cubic-bezier(0.175,.885,.32,1) .15s,left .8s cubic-bezier(0.175,.885,.32,1) .15s,bottom .8s cubic-bezier(0.175,.885,.32,1) .15s;
  44. }
  45. .ui.slide.reveal>.visible.content {
  46. position: relative!important;
  47. }
  48. .ui.slide.reveal>.hidden.content {
  49. position: absolute!important;
  50. right: 100%!important;
  51. width: 100%!important;
  52. }
  53. .ui.slide.reveal:hover>.visible.content {
  54. right: -100%!important;
  55. }
  56. .ui.slide.reveal:hover>.hidden.content {
  57. right: 0!important;
  58. }
  59. .ui.right.slide.reveal>.visible.content {
  60. right: 0;
  61. }
  62. .ui.right.slide.reveal>.hidden.content {
  63. right: auto!important;
  64. left: 100%!important;
  65. }
  66. .ui.right.slide.reveal:hover>.visible.content {
  67. right: 100%!important;
  68. left: auto!important;
  69. }
  70. .ui.right.slide.reveal:hover>.hidden.content {
  71. right: auto!important;
  72. left: 0!important;
  73. }
  74. .ui.up.slide.reveal>.visible.content {
  75. top: 0!important;
  76. right: 0!important;
  77. left: auto!important;
  78. bottom: auto!important;
  79. }
  80. .ui.up.slide.reveal>.hidden.content {
  81. top: 100%!important;
  82. right: 0!important;
  83. left: auto!important;
  84. bottom: auto!important;
  85. }
  86. .ui.slide.up.reveal:hover>.visible.content {
  87. top: -100%!important;
  88. right: 0!important;
  89. }
  90. .ui.slide.up.reveal:hover>.hidden.content {
  91. top: 0!important;
  92. right: 0!important;
  93. }
  94. .ui.down.slide.reveal>.visible.content {
  95. top: auto!important;
  96. left: auto!important;
  97. bottom: auto!important;
  98. bottom: 0!important;
  99. }
  100. .ui.down.slide.reveal>.hidden.content {
  101. top: auto!important;
  102. left: auto!important;
  103. bottom: 100%!important;
  104. right: 0!important;
  105. }
  106. .ui.slide.down.reveal:hover>.visible.content {
  107. right: 0!important;
  108. bottom: -100%!important;
  109. }
  110. .ui.slide.down.reveal:hover>.hidden.content {
  111. right: 0!important;
  112. bottom: 0!important;
  113. }
  114. .ui.fade.reveal>.visible.content {
  115. opacity: 1;
  116. }
  117. .ui.fade.reveal:hover>.visible.content {
  118. opacity: 0;
  119. }
  120. .ui.move.reveal>.visible.content,
  121. .ui.move.left.reveal>.visible.content {
  122. right: auto!important;
  123. top: auto!important;
  124. bottom: auto!important;
  125. left: 0!important;
  126. }
  127. .ui.move.reveal:hover>.visible.content,
  128. .ui.move.left.reveal:hover>.visible.content {
  129. left: 100%!important;
  130. }
  131. .ui.move.right.reveal>.visible.content {
  132. left: auto!important;
  133. top: auto!important;
  134. bottom: auto!important;
  135. right: 0!important;
  136. }
  137. .ui.move.right.reveal:hover>.visible.content {
  138. right: 100%!important;
  139. }
  140. .ui.move.up.reveal>.visible.content {
  141. left: auto!important;
  142. right: auto!important;
  143. top: auto!important;
  144. bottom: 0!important;
  145. }
  146. .ui.move.up.reveal:hover>.visible.content {
  147. bottom: 100%!important;
  148. }
  149. .ui.move.down.reveal>.visible.content {
  150. left: auto!important;
  151. right: auto!important;
  152. top: 0!important;
  153. bottom: auto!important;
  154. }
  155. .ui.move.down.reveal:hover>.visible.content {
  156. top: 100%!important;
  157. }
  158. .ui.rotate.reveal>.visible.content {
  159. -webkit-transition-duration: .8s;
  160. transition-duration: .8s;
  161. -webkit-transform: rotate(0deg);
  162. -ms-transform: rotate(0deg);
  163. transform: rotate(0deg);
  164. }
  165. .ui.rotate.reveal>.visible.content,
  166. .ui.rotate.right.reveal>.visible.content {
  167. -webkit-transform-origin: bottom left;
  168. -ms-transform-origin: bottom left;
  169. transform-origin: bottom left;
  170. }
  171. .ui.rotate.reveal:hover>.visible.content,
  172. .ui.rotate.right.reveal:hover>.visible.content {
  173. -webkit-transform: rotate(110deg);
  174. -ms-transform: rotate(110deg);
  175. transform: rotate(110deg);
  176. }
  177. .ui.rotate.left.reveal>.visible.content {
  178. -webkit-transform-origin: bottom right;
  179. -ms-transform-origin: bottom right;
  180. transform-origin: bottom right;
  181. }
  182. .ui.rotate.left.reveal:hover>.visible.content {
  183. -webkit-transform: rotate(-110deg);
  184. -ms-transform: rotate(-110deg);
  185. transform: rotate(-110deg);
  186. }
  187. .ui.disabled.reveal {
  188. opacity: 1!important;
  189. }
  190. .ui.disabled.reveal>.content {
  191. -webkit-transition: none!important;
  192. transition: none!important;
  193. }
  194. .ui.disabled.reveal:hover>.visible.content {
  195. position: static!important;
  196. display: block!important;
  197. opacity: 1!important;
  198. top: 0!important;
  199. right: 0!important;
  200. left: auto!important;
  201. bottom: auto!important;
  202. -webkit-transform: none!important;
  203. -ms-transform: none!important;
  204. transform: none!important;
  205. }
  206. .ui.disabled.reveal:hover>.hidden.content {
  207. display: none!important;
  208. }
  209. .ui.masked.reveal {
  210. overflow: hidden;
  211. }
  212. .ui.instant.reveal>.content {
  213. -webkit-transition-delay: 0s!important;
  214. transition-delay: 0s!important;
  215. }