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.

212 lines
3.3 KiB

  1. .ui.message {
  2. position: relative;
  3. min-height: 18px;
  4. margin: 1em 0;
  5. height: auto;
  6. background-color: #EFEFEF;
  7. padding: 1em;
  8. line-height: 1.33;
  9. color: rgba(0,0,0,.6);
  10. -webkit-transition: opacity .1s ease,color .1s ease,background .1s ease,box-shadow .1s ease;
  11. transition: opacity .1s ease,color .1s ease,background .1s ease,box-shadow .1s ease;
  12. -moz-box-sizing: border-box;
  13. -ms-box-sizing: border-box;
  14. box-sizing: border-box;
  15. border-radius: .325em;
  16. }
  17. .ui.message:first-child {
  18. margin-top: 0;
  19. }
  20. .ui.message:last-child {
  21. margin-bottom: 0;
  22. }
  23. .ui.message .header {
  24. margin: 0;
  25. font-size: 1.33em;
  26. font-weight: 700;
  27. }
  28. .ui.message p {
  29. opacity: .85;
  30. margin: 1em 0;
  31. }
  32. .ui.message p:first-child {
  33. margin-top: 0;
  34. }
  35. .ui.message p:last-child {
  36. margin-bottom: 0;
  37. }
  38. .ui.message .header+p {
  39. margin-top: .3em;
  40. }
  41. .ui.message>:first-child {
  42. margin-top: 0;
  43. }
  44. .ui.message>:last-child {
  45. margin-bottom: 0;
  46. }
  47. .ui.message ul.list {
  48. opacity: .85;
  49. list-style-position: inside;
  50. margin: .2em 0;
  51. padding: 0;
  52. }
  53. .ui.message ul.list li {
  54. position: relative;
  55. list-style-type: none;
  56. margin: 0 0 .3em 1em;
  57. padding: 0;
  58. }
  59. .ui.message ul.list li:before {
  60. position: absolute;
  61. content: '\2022';
  62. top: -.05em;
  63. left: -.8em;
  64. height: 100%;
  65. vertical-align: baseline;
  66. opacity: .5;
  67. }
  68. .ui.message ul.list li:first-child {
  69. margin-top: 0;
  70. }
  71. .ui.message>.close.icon {
  72. cursor: pointer;
  73. position: absolute;
  74. top: 1em;
  75. right: .5em;
  76. opacity: .7;
  77. -webkit-transition: opacity .1s linear;
  78. transition: opacity .1s linear;
  79. }
  80. .ui.message>.close.icon:hover {
  81. opacity: 1;
  82. }
  83. .ui.message.visible,
  84. .ui.header.visible {
  85. display: block!important;
  86. }
  87. .ui.message.hidden,
  88. .ui.header.hidden {
  89. display: none;
  90. }
  91. .ui.compact.message {
  92. display: inline-block;
  93. }
  94. .ui.attached.message {
  95. margin-left: -1px;
  96. margin-right: -1px;
  97. margin-bottom: -1px;
  98. border-radius: .325em .325em 0 0;
  99. box-shadow: 0 0 0 1px rgba(0,0,0,.1) inset;
  100. }
  101. .ui.bottom.attached.message {
  102. margin-top: -1px;
  103. border-radius: 0 0 .325em .325em;
  104. }
  105. .ui.icon.message {
  106. display: table;
  107. width: 100%;
  108. }
  109. .ui.icon.message>.icon {
  110. display: table-cell;
  111. vertical-align: middle;
  112. font-size: 3.8em;
  113. opacity: .5;
  114. }
  115. .ui.icon.message>.icon+.content {
  116. padding-left: 1em;
  117. }
  118. .ui.icon.message>.content {
  119. display: table-cell;
  120. vertical-align: middle;
  121. }
  122. .ui.inverted.message {
  123. background-color: rgba(255,255,255,.05);
  124. color: rgba(255,255,255,.95);
  125. }
  126. .ui.floating.message {
  127. box-shadow: 0 1px 3px 0 rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.05) inset;
  128. }
  129. .ui.black.message {
  130. background-color: #333;
  131. color: rgba(255,255,255,.95);
  132. }
  133. .ui.blue.message,
  134. .ui.info.message {
  135. background-color: #E6F4F9;
  136. color: #4D8796;
  137. }
  138. .ui.green.message {
  139. background-color: #DEFCD5;
  140. color: #52A954;
  141. }
  142. .ui.yellow.message,
  143. .ui.warning.message {
  144. background-color: #F6F3D5;
  145. color: #96904D;
  146. }
  147. .ui.red.message {
  148. background-color: #F1D7D7;
  149. color: #A95252;
  150. }
  151. .ui.success.message,
  152. .ui.positive.message {
  153. background-color: #DEFCD5;
  154. color: #52A954;
  155. }
  156. .ui.error.message,
  157. .ui.negative.message {
  158. background-color: #F1D7D7;
  159. color: #A95252;
  160. }
  161. .ui.small.message {
  162. font-size: .875em;
  163. }
  164. .ui.message {
  165. font-size: 1em;
  166. }
  167. .ui.large.message {
  168. font-size: 1.125em;
  169. }
  170. .ui.huge.message {
  171. font-size: 1.5em;
  172. }
  173. .ui.massive.message {
  174. font-size: 2em;
  175. }