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.

187 lines
2.8 KiB

  1. .ui.popup {
  2. display: none;
  3. position: absolute;
  4. top: 0;
  5. left: 0;
  6. z-index: 900;
  7. border: 1px solid rgba(0,0,0,.1);
  8. max-width: 250px;
  9. background-color: #FFF;
  10. padding: .8em 1.2em;
  11. font-size: .875rem;
  12. font-weight: 400;
  13. font-style: normal;
  14. color: rgba(0,0,0,.7);
  15. border-radius: .2em;
  16. box-shadow: 0 1px 2px rgba(0,0,0,.1);
  17. }
  18. .ui.popup .header {
  19. padding: 0 0 .5em;
  20. font-size: 1.125em;
  21. line-height: 1.2;
  22. font-weight: 700;
  23. }
  24. .ui.popup:before {
  25. position: absolute;
  26. content: "";
  27. width: .75em;
  28. height: .75rem;
  29. background-image: none;
  30. background-color: #FFF;
  31. -webkit-transform: rotate(45deg);
  32. -ms-transform: rotate(45deg);
  33. transform: rotate(45deg);
  34. z-index: 2;
  35. -moz-box-sizing: border-box;
  36. -ms-box-sizing: border-box;
  37. box-sizing: border-box;
  38. box-shadow: 1px 1px 1px rgba(0,0,0,.1);
  39. }
  40. .ui.popup .ui.button {
  41. width: 100%;
  42. }
  43. .ui.popup {
  44. margin: 0;
  45. }
  46. .ui.popup.bottom {
  47. margin: .75em 0 0;
  48. }
  49. .ui.popup.top {
  50. margin: 0 0 .75em;
  51. }
  52. .ui.popup.left.center {
  53. margin: 0 0 0 .75em;
  54. }
  55. .ui.popup.right.center {
  56. margin: 0 .75em 0 0;
  57. }
  58. .ui.popup.center {
  59. margin-right: -1.25em;
  60. }
  61. .ui.bottom.center.popup:before {
  62. margin-right: -.4em;
  63. top: -.4em;
  64. right: 50%;
  65. left: auto;
  66. bottom: auto;
  67. box-shadow: -1px -1px 1px rgba(0,0,0,.2);
  68. }
  69. .ui.bottom.left.popup {
  70. margin-left: -2em;
  71. }
  72. .ui.bottom.left.popup:before {
  73. top: -.4em;
  74. left: 1em;
  75. bottom: auto;
  76. right: auto;
  77. margin-right: 0;
  78. box-shadow: -1px -1px 1px rgba(0,0,0,.2);
  79. }
  80. .ui.bottom.right.popup {
  81. margin-right: -2em;
  82. }
  83. .ui.bottom.right.popup:before {
  84. top: -.4em;
  85. right: 1em;
  86. left: auto;
  87. bottom: auto;
  88. margin-right: 0;
  89. box-shadow: -1px -1px 1px rgba(0,0,0,.2);
  90. }
  91. .ui.top.center.popup:before {
  92. top: auto;
  93. left: auto;
  94. bottom: -.4em;
  95. right: 50%;
  96. margin-right: -.4em;
  97. }
  98. .ui.top.left.popup {
  99. margin-left: -2em;
  100. }
  101. .ui.top.left.popup:before {
  102. bottom: -.4em;
  103. left: 1em;
  104. top: auto;
  105. right: auto;
  106. margin-right: 0;
  107. }
  108. .ui.top.right.popup {
  109. margin-right: -2em;
  110. }
  111. .ui.top.right.popup:before {
  112. bottom: -.4em;
  113. right: 1em;
  114. top: auto;
  115. left: auto;
  116. margin-right: 0;
  117. }
  118. .ui.left.center.popup:before {
  119. top: 50%;
  120. left: -.35em;
  121. bottom: auto;
  122. right: auto;
  123. margin-top: -.4em;
  124. box-shadow: 1px -1px 1px rgba(0,0,0,.2);
  125. }
  126. .ui.right.center.popup:before {
  127. top: 50%;
  128. right: -.35em;
  129. bottom: auto;
  130. left: auto;
  131. margin-top: -.4em;
  132. box-shadow: -1px 1px 1px rgba(0,0,0,.2);
  133. }
  134. .ui.loading.popup {
  135. display: block;
  136. visibility: hidden;
  137. }
  138. .ui.active.popup {
  139. display: block;
  140. }
  141. .ui.small.popup {
  142. font-size: .75rem;
  143. }
  144. .ui.large.popup {
  145. font-size: 1rem;
  146. }
  147. .ui.inverted.popup {
  148. background-color: #333;
  149. border: 0;
  150. color: #FFF;
  151. box-shadow: none;
  152. }
  153. .ui.inverted.popup .header {
  154. background-color: rgba(0,0,0,.2);
  155. color: #FFF;
  156. }
  157. .ui.inverted.popup:before {
  158. background-color: #333;
  159. box-shadow: none;
  160. }