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.

464 lines
8.5 KiB

9 years ago
9 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*!
  2. * # Semantic UI 2.0.0 - Message
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Copyright 2015 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. /*******************************
  12. Message
  13. *******************************/
  14. .ui.message {
  15. position: relative;
  16. min-height: 1em;
  17. margin: 1em 0em;
  18. background: #f8f8f9;
  19. padding: 1em 1.5em;
  20. line-height: 1.4285em;
  21. color: rgba(0, 0, 0, 0.87);
  22. -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
  23. transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
  24. border-radius: 0.285714rem;
  25. box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  26. }
  27. .ui.message:first-child {
  28. margin-top: 0em;
  29. }
  30. .ui.message:last-child {
  31. margin-bottom: 0em;
  32. }
  33. /*--------------
  34. Content
  35. ---------------*/
  36. /* Header */
  37. .ui.message .header {
  38. display: block;
  39. font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
  40. font-weight: bold;
  41. margin: -0.165em 0em 0rem 0em;
  42. }
  43. /* Default font size */
  44. .ui.message .header:not(.ui) {
  45. font-size: 1.14285714em;
  46. }
  47. /* Paragraph */
  48. .ui.message p {
  49. opacity: 0.85;
  50. margin: 0.75em 0em;
  51. }
  52. .ui.message p:first-child {
  53. margin-top: 0em;
  54. }
  55. .ui.message p:last-child {
  56. margin-bottom: 0em;
  57. }
  58. .ui.message .header + p {
  59. margin-top: 0.25em;
  60. }
  61. /* List */
  62. .ui.message ul.list {
  63. text-align: left;
  64. padding: 0em;
  65. opacity: 0.85;
  66. list-style-position: inside;
  67. margin: 0.5em 0em 0em;
  68. }
  69. .ui.message ul.list:first-child {
  70. margin-top: 0em;
  71. }
  72. .ui.message ul.list:last-child {
  73. margin-bottom: 0em;
  74. }
  75. .ui.message ul.list li {
  76. position: relative;
  77. list-style-type: none;
  78. margin: 0em 0em 0.3em 1em;
  79. padding: 0em;
  80. }
  81. .ui.message ul.list li:before {
  82. position: absolute;
  83. content: '•';
  84. left: -1em;
  85. height: 100%;
  86. vertical-align: baseline;
  87. }
  88. .ui.message ul.list li:last-child {
  89. margin-bottom: 0em;
  90. }
  91. /* Icon */
  92. .ui.message > .icon {
  93. margin-right: 0.6em;
  94. }
  95. /* Close Icon */
  96. .ui.message > .close.icon {
  97. cursor: pointer;
  98. position: absolute;
  99. margin: 0em;
  100. top: 0.78575em;
  101. right: 0.5em;
  102. opacity: 0.7;
  103. -webkit-transition: opacity 0.1s ease;
  104. transition: opacity 0.1s ease;
  105. }
  106. .ui.message > .close.icon:hover {
  107. opacity: 1;
  108. }
  109. /* First / Last Element */
  110. .ui.message > :first-child {
  111. margin-top: 0em;
  112. }
  113. .ui.message > :last-child {
  114. margin-bottom: 0em;
  115. }
  116. /*******************************
  117. Coupling
  118. *******************************/
  119. .ui.dropdown .menu > .message {
  120. margin: 0px -1px;
  121. }
  122. /*******************************
  123. States
  124. *******************************/
  125. /*--------------
  126. Visible
  127. ---------------*/
  128. .ui.visible.visible.visible.visible.message {
  129. display: block;
  130. }
  131. .ui.icon.visible.visible.visible.visible.message {
  132. display: -webkit-box;
  133. display: -webkit-flex;
  134. display: -ms-flexbox;
  135. display: flex;
  136. }
  137. /*--------------
  138. Hidden
  139. ---------------*/
  140. .ui.hidden.hidden.hidden.hidden.message {
  141. display: none;
  142. }
  143. /*******************************
  144. Variations
  145. *******************************/
  146. /*--------------
  147. Compact
  148. ---------------*/
  149. .ui.compact.message {
  150. display: inline-block;
  151. }
  152. /*--------------
  153. Attached
  154. ---------------*/
  155. .ui.attached.message {
  156. margin-bottom: -1px;
  157. border-radius: 0.285714rem 0.285714rem 0em 0em;
  158. box-shadow: 0em 0em 0em 1px rgba(34, 36, 38, 0.15) inset;
  159. margin-left: -1px;
  160. margin-right: -1px;
  161. }
  162. .ui.attached + .ui.attached.message:not(.top):not(.bottom) {
  163. margin-top: -1px;
  164. border-radius: 0em;
  165. }
  166. .ui.bottom.attached.message {
  167. margin-top: -1px;
  168. border-radius: 0em 0em 0.285714rem 0.285714rem;
  169. box-shadow: 0em 0em 0em 1px rgba(34, 36, 38, 0.15) inset, 0px 1px 2px 0 rgba(34, 36, 38, 0.15);
  170. }
  171. .ui.bottom.attached.message:not(:last-child) {
  172. margin-bottom: 1em;
  173. }
  174. .ui.attached.icon.message {
  175. display: block;
  176. width: auto;
  177. }
  178. /*--------------
  179. Icon
  180. ---------------*/
  181. .ui.icon.message {
  182. display: -webkit-box;
  183. display: -webkit-flex;
  184. display: -ms-flexbox;
  185. display: flex;
  186. width: 100%;
  187. -webkit-box-align: center;
  188. -webkit-align-items: center;
  189. -ms-flex-align: center;
  190. align-items: center;
  191. }
  192. .ui.icon.message > .icon:not(.close) {
  193. display: block;
  194. -webkit-box-flex: 0;
  195. -webkit-flex: 0 1 auto;
  196. -ms-flex: 0 1 auto;
  197. flex: 0 1 auto;
  198. width: auto;
  199. line-height: 1;
  200. vertical-align: middle;
  201. font-size: 3em;
  202. opacity: 0.8;
  203. }
  204. .ui.icon.message > .content {
  205. display: block;
  206. -webkit-box-flex: 1;
  207. -webkit-flex: 1 1 auto;
  208. -ms-flex: 1 1 auto;
  209. flex: 1 1 auto;
  210. vertical-align: middle;
  211. }
  212. .ui.icon.message .icon:not(.close) + .content {
  213. padding-left: 0rem;
  214. }
  215. .ui.icon.message .circular.icon {
  216. width: 1em;
  217. }
  218. /*--------------
  219. Floating
  220. ---------------*/
  221. .ui.floating.message {
  222. box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.22) inset, 0px 2px 4px 0px rgba(34, 36, 38, 0.1), 0px 0px 10px 0px rgba(34, 36, 38, 0.05);
  223. }
  224. /*--------------
  225. Colors
  226. ---------------*/
  227. .ui.black.message {
  228. background-color: #1b1c1d;
  229. color: rgba(255, 255, 255, 0.9);
  230. }
  231. /*--------------
  232. Types
  233. ---------------*/
  234. /* Positive */
  235. .ui.positive.message {
  236. background-color: #fcfff5;
  237. color: #1d571e;
  238. }
  239. .ui.positive.message,
  240. .ui.attached.positive.message {
  241. box-shadow: 0px 0px 0px 1px #a3c293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  242. }
  243. .ui.positive.message .header {
  244. color: #1a531b;
  245. }
  246. /* Negative */
  247. .ui.negative.message {
  248. background-color: #fff6f6;
  249. color: #922d2b;
  250. }
  251. .ui.negative.message,
  252. .ui.attached.negative.message {
  253. box-shadow: 0px 0px 0px 1px #e0b4b4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  254. }
  255. .ui.negative.message .header {
  256. color: #912d2b;
  257. }
  258. /* Info */
  259. .ui.info.message {
  260. background-color: #f8ffff;
  261. color: #0e566d;
  262. }
  263. .ui.info.message,
  264. .ui.attached.info.message {
  265. box-shadow: 0px 0px 0px 1px #9ecad3 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  266. }
  267. .ui.info.message .header {
  268. color: #0e566c;
  269. }
  270. /* Warning */
  271. .ui.warning.message {
  272. background-color: #fffaf3;
  273. color: #664917;
  274. }
  275. .ui.warning.message,
  276. .ui.attached.warning.message {
  277. box-shadow: 0px 0px 0px 1px #c9ba9b inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  278. }
  279. .ui.warning.message .header {
  280. color: #794b02;
  281. }
  282. /* Error */
  283. .ui.error.message {
  284. background-color: #fff6f6;
  285. color: #922d2b;
  286. }
  287. .ui.error.message,
  288. .ui.attached.error.message {
  289. box-shadow: 0px 0px 0px 1px #e0b4b4 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  290. }
  291. .ui.error.message .header {
  292. color: #912d2b;
  293. }
  294. /* Success */
  295. .ui.success.message {
  296. background-color: #fcfff5;
  297. color: #1d571e;
  298. }
  299. .ui.success.message,
  300. .ui.attached.success.message {
  301. box-shadow: 0px 0px 0px 1px #a3c293 inset, 0px 0px 0px 0px rgba(0, 0, 0, 0);
  302. }
  303. .ui.success.message .header {
  304. color: #1a531b;
  305. }
  306. /* Colors */
  307. .ui.inverted.message,
  308. .ui.black.message {
  309. background-color: #1b1c1d;
  310. color: rgba(255, 255, 255, 0.9);
  311. }
  312. .ui.red.message {
  313. background-color: #ffe8e6;
  314. color: #db2828;
  315. }
  316. .ui.red.message .header {
  317. color: #c82121;
  318. }
  319. .ui.orange.message {
  320. background-color: #ffedde;
  321. color: #f2711c;
  322. }
  323. .ui.orange.message .header {
  324. color: #e7640d;
  325. }
  326. .ui.yellow.message {
  327. background-color: #fff8db;
  328. color: #b58105;
  329. }
  330. .ui.yellow.message .header {
  331. color: #9c6f04;
  332. }
  333. .ui.olive.message {
  334. background-color: #fbfdef;
  335. color: #8abc1e;
  336. }
  337. .ui.olive.message .header {
  338. color: #7aa61a;
  339. }
  340. .ui.green.message {
  341. background-color: #e5f9e7;
  342. color: #1ebc30;
  343. }
  344. .ui.green.message .header {
  345. color: #1aa62a;
  346. }
  347. .ui.teal.message {
  348. background-color: #e1f7f7;
  349. color: #10a3a3;
  350. }
  351. .ui.teal.message .header {
  352. color: #0e8c8c;
  353. }
  354. .ui.blue.message {
  355. background-color: #dff0ff;
  356. color: #2185d0;
  357. }
  358. .ui.blue.message .header {
  359. color: #1e77ba;
  360. }
  361. .ui.violet.message {
  362. background-color: #eae7ff;
  363. color: #6435c9;
  364. }
  365. .ui.violet.message .header {
  366. color: #5a30b5;
  367. }
  368. .ui.purple.message {
  369. background-color: #f6e7ff;
  370. color: #a333c8;
  371. }
  372. .ui.purple.message .header {
  373. color: #922eb4;
  374. }
  375. .ui.pink.message {
  376. background-color: #ffe3fb;
  377. color: #e03997;
  378. }
  379. .ui.pink.message .header {
  380. color: #dd238b;
  381. }
  382. .ui.brown.message {
  383. background-color: #f1e2d3;
  384. color: #a5673f;
  385. }
  386. .ui.brown.message .header {
  387. color: #935b38;
  388. }
  389. /*--------------
  390. Sizes
  391. ---------------*/
  392. .ui.small.message {
  393. font-size: 0.92857143em;
  394. }
  395. .ui.message {
  396. font-size: 1em;
  397. }
  398. .ui.large.message {
  399. font-size: 1.14285714em;
  400. }
  401. .ui.huge.message {
  402. font-size: 1.42857143em;
  403. }
  404. .ui.massive.message {
  405. font-size: 1.71428571em;
  406. }
  407. /*******************************
  408. Theme Overrides
  409. *******************************/
  410. /*******************************
  411. User Variable Overrides
  412. *******************************/