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.

478 lines
7.6 KiB

  1. ul.ui.list,
  2. ol.ui.list,
  3. .ui.list {
  4. list-style-type: none;
  5. margin: 1em 0;
  6. padding: 0;
  7. }
  8. ul.ui.list ul,
  9. ol.ui.list ol,
  10. .ui.list .list {
  11. margin: 0;
  12. padding: .5em 0 .5em 1em;
  13. }
  14. ul.ui.list:first-child,
  15. ol.ui.list:first-child,
  16. .ui.list:first-child {
  17. margin-top: 0;
  18. }
  19. ul.ui.list:last-child,
  20. ol.ui.list:last-child,
  21. .ui.list:last-child {
  22. margin-bottom: 0;
  23. }
  24. ul.ui.list li,
  25. ol.ui.list li,
  26. .ui.list .item {
  27. display: list-item;
  28. list-style-type: none;
  29. list-style-position: inside;
  30. padding: .3em 0;
  31. line-height: 1.2;
  32. }
  33. .ui.list .item:after {
  34. content: '';
  35. display: block;
  36. height: 0;
  37. clear: both;
  38. visibility: hidden;
  39. }
  40. .ui.list .item>.icon {
  41. display: table-cell;
  42. margin: 0;
  43. padding: .1em .5em 0 0;
  44. vertical-align: top;
  45. }
  46. .ui.list .item>.icon:only-child {
  47. display: inline-block;
  48. }
  49. .ui.horizontal.list .item>.icon {
  50. padding: 0 .25em 0 0;
  51. }
  52. .ui.list .item>img {
  53. display: inline-block;
  54. width: 2em;
  55. margin-right: .5em;
  56. vertical-align: middle;
  57. border-radius: .2em;
  58. }
  59. .ui.list .item>.content {
  60. display: inline-block;
  61. vertical-align: middle;
  62. line-height: 1.2;
  63. }
  64. .ui.list .item>.icon+.content {
  65. display: table-cell;
  66. vertical-align: top;
  67. padding-left: .5em;
  68. }
  69. .ui.list a {
  70. cursor: pointer;
  71. }
  72. .ui.list a .icon {
  73. color: rgba(0,0,0,.6);
  74. -webkit-transition: color .2s ease;
  75. transition: color .2s ease;
  76. }
  77. .ui.list .header {
  78. font-weight: 700;
  79. }
  80. .ui.list .description {
  81. color: rgba(0,0,0,.5);
  82. }
  83. .ui.list .item>.left.floated {
  84. margin-right: 1em;
  85. float: left;
  86. }
  87. .ui.list .item>.right.floated {
  88. margin-left: 1em;
  89. float: right;
  90. }
  91. .ui.horizontal.list {
  92. display: inline-block;
  93. font-size: 0;
  94. }
  95. .ui.horizontal.list .item {
  96. display: inline-block;
  97. margin-left: 1em;
  98. font-size: 1rem;
  99. }
  100. .ui.horizontal.list .item:first-child {
  101. margin-left: 0;
  102. }
  103. .ui.list a:hover .icon {
  104. color: rgba(0,0,0,.8);
  105. }
  106. .ui.link.list .item {
  107. color: rgba(0,0,0,.4);
  108. }
  109. .ui.link.list a.item,
  110. .ui.link.list .item a {
  111. color: rgba(0,0,0,.6);
  112. }
  113. .ui.link.list a.item:hover,
  114. .ui.link.list .item a:hover {
  115. color: rgba(0,0,0,.8);
  116. }
  117. .ui.link.list a.item:active,
  118. .ui.link.list .item a:active {
  119. color: rgba(0,0,0,.9);
  120. }
  121. .ui.link.list a.active.item,
  122. .ui.link.list .active.item a {
  123. color: rgba(0,0,0,.8);
  124. }
  125. .ui.selection.list .item {
  126. cursor: pointer;
  127. color: rgba(0,0,0,.4);
  128. padding: .5em;
  129. -webkit-transition: .2s color ease,.2s padding-left ease,.2s background-color ease;
  130. transition: .2s color ease,.2s padding-left ease,.2s background-color ease;
  131. }
  132. .ui.selection.list .item:hover {
  133. background-color: rgba(0,0,0,.02);
  134. color: rgba(0,0,0,.7);
  135. }
  136. .ui.selection.list:not(.horizontal,
  137. .ordered) .item:hover {
  138. padding-left: 1em;
  139. }
  140. .ui.selection.list:not(.horizontal,
  141. .ordered) .item:hover .item:hover {
  142. padding-left: .5em;
  143. }
  144. .ui.selection.list .item:active {
  145. background-color: rgba(0,0,0,.05);
  146. color: rgba(0,0,0,.7);
  147. }
  148. .ui.selection.list .item.active {
  149. background-color: rgba(0,0,0,.04);
  150. color: rgba(0,0,0,.7);
  151. }
  152. ul.ui.list,
  153. .ui.bulleted.list {
  154. margin-left: 1.5em;
  155. }
  156. ul.ui.list li,
  157. .ui.bulleted.list .item {
  158. position: relative;
  159. }
  160. ul.ui.list li:before,
  161. .ui.bulleted.list .item:before {
  162. position: absolute;
  163. left: -1.5em;
  164. content: '•';
  165. line-height: 1.2rem;
  166. vertical-align: top;
  167. }
  168. ul.ui.list ul,
  169. .ui.bulleted.list .list {
  170. padding-left: 1.5em;
  171. }
  172. ul.ui.horizontal.bulleted.list,
  173. .ui.horizontal.bulleted.list {
  174. margin-left: 0;
  175. }
  176. ul.ui.horizontal.bulleted.list li,
  177. .ui.horizontal.bulleted.list .item {
  178. margin-left: 1.5em;
  179. }
  180. ul.ui.horizontal.bulleted.list li:before,
  181. .ui.horizontal.bulleted.list .item:before {
  182. left: -.9em;
  183. }
  184. ul.ui.horizontal.bulleted.list li:first-child,
  185. .ui.horizontal.bulleted.list .item:first-child {
  186. margin-left: 0;
  187. }
  188. ul.ui.horizontal.bulleted.list li:first-child::before,
  189. .ui.horizontal.bulleted.list .item:first-child::before {
  190. display: none;
  191. }
  192. ol.ui.list,
  193. .ui.ordered.list {
  194. counter-reset: ordered;
  195. margin-left: 2em;
  196. list-style-type: none;
  197. }
  198. ol.ui.list li,
  199. .ui.ordered.list .item {
  200. list-style-type: none;
  201. position: relative;
  202. }
  203. ol.ui.list li:before,
  204. .ui.ordered.list .item:before {
  205. position: absolute;
  206. left: -2em;
  207. counter-increment: ordered;
  208. content: counters(ordered,".");
  209. text-align: right;
  210. vertical-align: top;
  211. opacity: .75;
  212. }
  213. ol.ui.list ol,
  214. .ui.ordered.list .list {
  215. counter-reset: ordered;
  216. padding-left: 2.5em;
  217. }
  218. ol.ui.list ol li:before,
  219. .ui.ordered.list .list .item:before {
  220. left: -2.5em;
  221. }
  222. ol.ui.horizontal.list,
  223. .ui.ordered.horizontal.list {
  224. margin-left: 0;
  225. }
  226. ol.ui.horizontal.list li:before,
  227. .ui.ordered.horizontal.list .item:before {
  228. position: static;
  229. margin: 0 .5em 0 0;
  230. }
  231. .ui.divided.list>.item,
  232. .ui.divided.list>.list {
  233. border-top: 1px solid rgba(0,0,0,.1);
  234. padding-left: .5em;
  235. padding-right: .5em;
  236. }
  237. .ui.divided.list .item .menu .item {
  238. border-width: 0;
  239. }
  240. .ui.divided.list .item:first-child {
  241. border-top-width: 0;
  242. }
  243. .ui.divided.list .list {
  244. margin-left: -.5em;
  245. margin-right: -.5em;
  246. }
  247. .ui.divided.list .list .item {
  248. padding-left: 1em;
  249. padding-right: 1em;
  250. }
  251. .ui.divided.list .list .item:first-child {
  252. border-top-width: 1px;
  253. }
  254. .ui.divided.bulleted.list {
  255. margin-left: 0;
  256. }
  257. .ui.divided.bulleted.list .item {
  258. padding-left: 1.5em;
  259. }
  260. .ui.divided.bulleted.list .item:before {
  261. left: .5em;
  262. }
  263. .ui.divided.ordered.list {
  264. margin-left: 0;
  265. }
  266. .ui.divided.ordered.list>.item {
  267. padding-left: 2em;
  268. padding-right: 2em;
  269. }
  270. .ui.divided.ordered.list>.item:before {
  271. left: .5em;
  272. }
  273. .ui.divided.ordered.list .item .list {
  274. margin-left: -2em;
  275. margin-right: -2em;
  276. }
  277. .ui.divided.horizontal.list {
  278. margin-left: 0;
  279. }
  280. .ui.divided.horizontal.list .item {
  281. border-top: 0;
  282. border-left: 1px solid rgba(0,0,0,.1);
  283. margin: 0;
  284. padding-left: .75em;
  285. padding-right: .75em;
  286. line-height: .6;
  287. }
  288. .ui.horizontal.divided.list .item:first-child {
  289. border-left: 0;
  290. padding-left: 0;
  291. }
  292. .ui.celled.list>.item,
  293. .ui.celled.list>.list {
  294. border-top: 1px solid rgba(0,0,0,.1);
  295. padding-left: .5em;
  296. padding-right: .5em;
  297. }
  298. .ui.celled.list>.item:last-child {
  299. border-bottom: 1px solid rgba(0,0,0,.1);
  300. }
  301. .ui.celled.list .item .list {
  302. margin-left: -.5em;
  303. margin-right: -.5em;
  304. }
  305. .ui.celled.list .item .list .item {
  306. border-width: 0;
  307. }
  308. .ui.celled.list .list .item:first-child {
  309. border-top-width: 0;
  310. }
  311. .ui.celled.bulleted.list {
  312. margin-left: 0;
  313. }
  314. .ui.celled.bulleted.list>.item {
  315. padding-left: 1.5em;
  316. }
  317. .ui.celled.bulleted.list>.item:before {
  318. left: .5em;
  319. }
  320. .ui.celled.ordered.list {
  321. margin-left: 0;
  322. }
  323. .ui.celled.ordered.list .item {
  324. padding-left: 2em;
  325. padding-right: 2em;
  326. }
  327. .ui.celled.ordered.list .item:before {
  328. left: .5em;
  329. }
  330. .ui.celled.ordered.list .item .list {
  331. margin-left: -2em;
  332. margin-right: -2em;
  333. }
  334. .ui.horizontal.celled.list {
  335. margin-left: 0;
  336. }
  337. .ui.horizontal.celled.list .item {
  338. border-top: 0;
  339. border-left: 1px solid rgba(0,0,0,.1);
  340. margin: 0;
  341. padding-left: .75em;
  342. padding-right: .75em;
  343. line-height: .6;
  344. }
  345. .ui.horizontal.celled.list .item:last-child {
  346. border-bottom: 0;
  347. border-right: 1px solid rgba(0,0,0,.1);
  348. }
  349. .ui.relaxed.list:not(.horizontal) .item {
  350. padding-top: .5em;
  351. padding-bottom: .5em;
  352. }
  353. .ui.horizontal.relaxed.list .item {
  354. padding-left: 1.25em;
  355. padding-right: 1.25em;
  356. }
  357. .ui.very.relaxed.list:not(.horizontal) .item {
  358. padding-top: 1em;
  359. padding-bottom: 1em;
  360. }
  361. .ui.horizontal.very.relaxed.list .item {
  362. padding-left: 2em;
  363. padding-right: 2em;
  364. }
  365. .ui.mini.list .item {
  366. font-size: .7rem;
  367. }
  368. .ui.tiny.list .item {
  369. font-size: .8125rem;
  370. }
  371. .ui.small.list .item {
  372. font-size: .875rem;
  373. }
  374. .ui.list .item {
  375. font-size: 1em;
  376. }
  377. .ui.large.list .item {
  378. font-size: 1.125rem;
  379. }
  380. .ui.big.list .item {
  381. font-size: 1.25rem;
  382. }
  383. .ui.huge.list .item {
  384. font-size: 1.375rem;
  385. }
  386. .ui.massive.list .item {
  387. font-size: 1.5rem;
  388. }