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.

1108 lines
22 KiB

9 years ago
8 years ago
9 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 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
9 years ago
10 years ago
9 years ago
10 years ago
9 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
9 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
10 years ago
10 years ago
10 years ago
9 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
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
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
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
9 years ago
10 years ago
10 years ago
9 years ago
10 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 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
9 years ago
9 years ago
10 years ago
9 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
9 years ago
10 years ago
9 years ago
10 years ago
9 years ago
9 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
9 years ago
10 years ago
9 years ago
9 years ago
9 years ago
10 years ago
9 years ago
9 years ago
10 years ago
9 years ago
9 years ago
10 years ago
10 years ago
9 years ago
9 years ago
10 years ago
9 years ago
9 years ago
10 years ago
9 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
9 years ago
9 years ago
9 years ago
10 years ago
9 years ago
9 years ago
10 years ago
9 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
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
9 years ago
10 years ago
10 years ago
  1. /*!
  2. * # Semantic UI 2.2.2 - Table
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Released under the MIT license
  7. * http://opensource.org/licenses/MIT
  8. *
  9. */
  10. /*******************************
  11. Table
  12. *******************************/
  13. /* Prototype */
  14. .ui.table {
  15. width: 100%;
  16. background: #FFFFFF;
  17. margin: 1em 0em;
  18. border: 1px solid rgba(34, 36, 38, 0.15);
  19. box-shadow: none;
  20. border-radius: 0.28571429rem;
  21. text-align: left;
  22. color: rgba(0, 0, 0, 0.87);
  23. border-collapse: separate;
  24. border-spacing: 0px;
  25. }
  26. .ui.table:first-child {
  27. margin-top: 0em;
  28. }
  29. .ui.table:last-child {
  30. margin-bottom: 0em;
  31. }
  32. /*******************************
  33. Parts
  34. *******************************/
  35. /* Table Content */
  36. .ui.table th,
  37. .ui.table td {
  38. -webkit-transition: background 0.1s ease, color 0.1s ease;
  39. transition: background 0.1s ease, color 0.1s ease;
  40. }
  41. /* Headers */
  42. .ui.table thead {
  43. box-shadow: none;
  44. }
  45. .ui.table thead th {
  46. cursor: auto;
  47. background: #F9FAFB;
  48. text-align: inherit;
  49. color: rgba(0, 0, 0, 0.87);
  50. padding: 0.92857143em 0.78571429em;
  51. vertical-align: inherit;
  52. font-style: none;
  53. font-weight: bold;
  54. text-transform: none;
  55. border-bottom: 1px solid rgba(34, 36, 38, 0.1);
  56. border-left: none;
  57. }
  58. .ui.table thead tr > th:first-child {
  59. border-left: none;
  60. }
  61. .ui.table thead tr:first-child > th:first-child {
  62. border-radius: 0.28571429rem 0em 0em 0em;
  63. }
  64. .ui.table thead tr:first-child > th:last-child {
  65. border-radius: 0em 0.28571429rem 0em 0em;
  66. }
  67. .ui.table thead tr:first-child > th:only-child {
  68. border-radius: 0.28571429rem 0.28571429rem 0em 0em;
  69. }
  70. /* Footer */
  71. .ui.table tfoot {
  72. box-shadow: none;
  73. }
  74. .ui.table tfoot th {
  75. cursor: auto;
  76. border-top: 1px solid rgba(34, 36, 38, 0.15);
  77. background: #F9FAFB;
  78. text-align: inherit;
  79. color: rgba(0, 0, 0, 0.87);
  80. padding: 0.78571429em 0.78571429em;
  81. vertical-align: middle;
  82. font-style: normal;
  83. font-weight: normal;
  84. text-transform: none;
  85. }
  86. .ui.table tfoot tr > th:first-child {
  87. border-left: none;
  88. }
  89. .ui.table tfoot tr:first-child > th:first-child {
  90. border-radius: 0em 0em 0em 0.28571429rem;
  91. }
  92. .ui.table tfoot tr:first-child > th:last-child {
  93. border-radius: 0em 0em 0.28571429rem 0em;
  94. }
  95. .ui.table tfoot tr:first-child > th:only-child {
  96. border-radius: 0em 0em 0.28571429rem 0.28571429rem;
  97. }
  98. /* Table Row */
  99. .ui.table tr td {
  100. border-top: 1px solid rgba(34, 36, 38, 0.1);
  101. }
  102. .ui.table tr:first-child td {
  103. border-top: none;
  104. }
  105. /* Table Cells */
  106. .ui.table td {
  107. padding: 0.78571429em 0.78571429em;
  108. text-align: inherit;
  109. }
  110. /* Icons */
  111. .ui.table > .icon {
  112. vertical-align: baseline;
  113. }
  114. .ui.table > .icon:only-child {
  115. margin: 0em;
  116. }
  117. /* Table Segment */
  118. .ui.table.segment {
  119. padding: 0em;
  120. }
  121. .ui.table.segment:after {
  122. display: none;
  123. }
  124. .ui.table.segment.stacked:after {
  125. display: block;
  126. }
  127. /* Responsive */
  128. @media only screen and (max-width: 767px) {
  129. .ui.table:not(.unstackable) {
  130. width: 100%;
  131. }
  132. .ui.table:not(.unstackable) tbody,
  133. .ui.table:not(.unstackable) tr,
  134. .ui.table:not(.unstackable) tr > th,
  135. .ui.table:not(.unstackable) tr > td {
  136. width: auto !important;
  137. display: block !important;
  138. }
  139. .ui.table:not(.unstackable) {
  140. padding: 0em;
  141. }
  142. .ui.table:not(.unstackable) thead {
  143. display: block;
  144. }
  145. .ui.table:not(.unstackable) tfoot {
  146. display: block;
  147. }
  148. .ui.table:not(.unstackable) tr {
  149. padding-top: 1em;
  150. padding-bottom: 1em;
  151. box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
  152. }
  153. .ui.table:not(.unstackable) tr > th,
  154. .ui.table:not(.unstackable) tr > td {
  155. background: none;
  156. border: none !important;
  157. padding: 0.25em 0.75em !important;
  158. box-shadow: none !important;
  159. }
  160. .ui.table:not(.unstackable) th:first-child,
  161. .ui.table:not(.unstackable) td:first-child {
  162. font-weight: bold;
  163. }
  164. /* Definition Table */
  165. .ui.definition.table:not(.unstackable) thead th:first-child {
  166. box-shadow: none !important;
  167. }
  168. }
  169. /*******************************
  170. Coupling
  171. *******************************/
  172. /* UI Image */
  173. .ui.table th .image,
  174. .ui.table th .image img,
  175. .ui.table td .image,
  176. .ui.table td .image img {
  177. max-width: none;
  178. }
  179. /*******************************
  180. Types
  181. *******************************/
  182. /*--------------
  183. Complex
  184. ---------------*/
  185. .ui.structured.table {
  186. border-collapse: collapse;
  187. }
  188. .ui.structured.table thead th {
  189. border-left: none;
  190. border-right: none;
  191. }
  192. .ui.structured.sortable.table thead th {
  193. border-left: 1px solid rgba(34, 36, 38, 0.15);
  194. border-right: 1px solid rgba(34, 36, 38, 0.15);
  195. }
  196. .ui.structured.basic.table th {
  197. border-left: none;
  198. border-right: none;
  199. }
  200. .ui.structured.celled.table tr th,
  201. .ui.structured.celled.table tr td {
  202. border-left: 1px solid rgba(34, 36, 38, 0.1);
  203. border-right: 1px solid rgba(34, 36, 38, 0.1);
  204. }
  205. /*--------------
  206. Definition
  207. ---------------*/
  208. .ui.definition.table thead:not(.full-width) th:first-child {
  209. pointer-events: none;
  210. background: transparent;
  211. font-weight: normal;
  212. color: rgba(0, 0, 0, 0.4);
  213. box-shadow: -1px -1px 0px 1px #FFFFFF;
  214. }
  215. .ui.definition.table tfoot:not(.full-width) th:first-child {
  216. pointer-events: none;
  217. background: transparent;
  218. font-weight: rgba(0, 0, 0, 0.4);
  219. color: normal;
  220. box-shadow: 1px 1px 0px 1px #FFFFFF;
  221. }
  222. /* Remove Border */
  223. .ui.celled.definition.table thead:not(.full-width) th:first-child {
  224. box-shadow: 0px -1px 0px 1px #FFFFFF;
  225. }
  226. .ui.celled.definition.table tfoot:not(.full-width) th:first-child {
  227. box-shadow: 0px 1px 0px 1px #FFFFFF;
  228. }
  229. /* Highlight Defining Column */
  230. .ui.definition.table tr td:first-child:not(.ignored),
  231. .ui.definition.table tr td.definition {
  232. background: rgba(0, 0, 0, 0.03);
  233. font-weight: bold;
  234. color: rgba(0, 0, 0, 0.95);
  235. text-transform: '';
  236. box-shadow: '';
  237. text-align: '';
  238. font-size: 1em;
  239. padding-left: '';
  240. padding-right: '';
  241. }
  242. /* Fix 2nd Column */
  243. .ui.definition.table thead:not(.full-width) th:nth-child(2) {
  244. border-left: 1px solid rgba(34, 36, 38, 0.15);
  245. }
  246. .ui.definition.table tfoot:not(.full-width) th:nth-child(2) {
  247. border-left: 1px solid rgba(34, 36, 38, 0.15);
  248. }
  249. .ui.definition.table td:nth-child(2) {
  250. border-left: 1px solid rgba(34, 36, 38, 0.15);
  251. }
  252. /*******************************
  253. States
  254. *******************************/
  255. /*--------------
  256. Positive
  257. ---------------*/
  258. .ui.table tr.positive,
  259. .ui.table td.positive {
  260. box-shadow: 0px 0px 0px #A3C293 inset;
  261. }
  262. .ui.table tr.positive,
  263. .ui.table td.positive {
  264. background: #FCFFF5 !important;
  265. color: #2C662D !important;
  266. }
  267. /*--------------
  268. Negative
  269. ---------------*/
  270. .ui.table tr.negative,
  271. .ui.table td.negative {
  272. box-shadow: 0px 0px 0px #E0B4B4 inset;
  273. }
  274. .ui.table tr.negative,
  275. .ui.table td.negative {
  276. background: #FFF6F6 !important;
  277. color: #9F3A38 !important;
  278. }
  279. /*--------------
  280. Error
  281. ---------------*/
  282. .ui.table tr.error,
  283. .ui.table td.error {
  284. box-shadow: 0px 0px 0px #E0B4B4 inset;
  285. }
  286. .ui.table tr.error,
  287. .ui.table td.error {
  288. background: #FFF6F6 !important;
  289. color: #9F3A38 !important;
  290. }
  291. /*--------------
  292. Warning
  293. ---------------*/
  294. .ui.table tr.warning,
  295. .ui.table td.warning {
  296. box-shadow: 0px 0px 0px #C9BA9B inset;
  297. }
  298. .ui.table tr.warning,
  299. .ui.table td.warning {
  300. background: #FFFAF3 !important;
  301. color: #573A08 !important;
  302. }
  303. /*--------------
  304. Active
  305. ---------------*/
  306. .ui.table tr.active,
  307. .ui.table td.active {
  308. box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.87) inset;
  309. }
  310. .ui.table tr.active,
  311. .ui.table td.active {
  312. background: #E0E0E0 !important;
  313. color: rgba(0, 0, 0, 0.87) !important;
  314. }
  315. /*--------------
  316. Disabled
  317. ---------------*/
  318. .ui.table tr.disabled td,
  319. .ui.table tr td.disabled,
  320. .ui.table tr.disabled:hover,
  321. .ui.table tr:hover td.disabled {
  322. pointer-events: none;
  323. color: rgba(40, 40, 40, 0.3);
  324. }
  325. /*******************************
  326. Variations
  327. *******************************/
  328. /*--------------
  329. Stackable
  330. ---------------*/
  331. @media only screen and (max-width: 991px) {
  332. .ui[class*="tablet stackable"].table,
  333. .ui[class*="tablet stackable"].table tbody,
  334. .ui[class*="tablet stackable"].table tr,
  335. .ui[class*="tablet stackable"].table tr > th,
  336. .ui[class*="tablet stackable"].table tr > td {
  337. width: 100% !important;
  338. display: block !important;
  339. }
  340. .ui[class*="tablet stackable"].table {
  341. padding: 0em;
  342. }
  343. .ui[class*="tablet stackable"].table thead {
  344. display: block;
  345. }
  346. .ui[class*="tablet stackable"].table tfoot {
  347. display: block;
  348. }
  349. .ui[class*="tablet stackable"].table tr {
  350. padding-top: 1em;
  351. padding-bottom: 1em;
  352. box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
  353. }
  354. .ui[class*="tablet stackable"].table tr > th,
  355. .ui[class*="tablet stackable"].table tr > td {
  356. background: none;
  357. border: none !important;
  358. padding: 0.25em 0.75em;
  359. box-shadow: none !important;
  360. }
  361. /* Definition Table */
  362. .ui.definition[class*="tablet stackable"].table thead th:first-child {
  363. box-shadow: none !important;
  364. }
  365. }
  366. /*--------------
  367. Text Alignment
  368. ---------------*/
  369. .ui.table[class*="left aligned"],
  370. .ui.table [class*="left aligned"] {
  371. text-align: left;
  372. }
  373. .ui.table[class*="center aligned"],
  374. .ui.table [class*="center aligned"] {
  375. text-align: center;
  376. }
  377. .ui.table[class*="right aligned"],
  378. .ui.table [class*="right aligned"] {
  379. text-align: right;
  380. }
  381. /*------------------
  382. Vertical Alignment
  383. ------------------*/
  384. .ui.table[class*="top aligned"],
  385. .ui.table [class*="top aligned"] {
  386. vertical-align: top;
  387. }
  388. .ui.table[class*="middle aligned"],
  389. .ui.table [class*="middle aligned"] {
  390. vertical-align: middle;
  391. }
  392. .ui.table[class*="bottom aligned"],
  393. .ui.table [class*="bottom aligned"] {
  394. vertical-align: bottom;
  395. }
  396. /*--------------
  397. Collapsing
  398. ---------------*/
  399. .ui.table th.collapsing,
  400. .ui.table td.collapsing {
  401. width: 1px;
  402. white-space: nowrap;
  403. }
  404. /*--------------
  405. Fixed
  406. ---------------*/
  407. .ui.fixed.table {
  408. table-layout: fixed;
  409. }
  410. .ui.fixed.table th,
  411. .ui.fixed.table td {
  412. overflow: hidden;
  413. text-overflow: ellipsis;
  414. }
  415. /*--------------
  416. Selectable
  417. ---------------*/
  418. .ui.selectable.table tbody tr:hover,
  419. .ui.table tbody tr td.selectable:hover {
  420. background: rgba(0, 0, 0, 0.05) !important;
  421. color: rgba(0, 0, 0, 0.95) !important;
  422. }
  423. .ui.selectable.inverted.table tbody tr:hover,
  424. .ui.inverted.table tbody tr td.selectable:hover {
  425. background: rgba(255, 255, 255, 0.08) !important;
  426. color: #ffffff !important;
  427. }
  428. /* Selectable Cell Link */
  429. .ui.table tbody tr td.selectable {
  430. padding: 0em;
  431. }
  432. .ui.table tbody tr td.selectable > a:not(.ui) {
  433. display: block;
  434. color: inherit;
  435. padding: 0.78571429em 0.78571429em;
  436. }
  437. /* Other States */
  438. .ui.selectable.table tr.error:hover,
  439. .ui.table tr td.selectable.error:hover,
  440. .ui.selectable.table tr:hover td.error {
  441. background: #ffe7e7 !important;
  442. color: #943634 !important;
  443. }
  444. .ui.selectable.table tr.warning:hover,
  445. .ui.table tr td.selectable.warning:hover,
  446. .ui.selectable.table tr:hover td.warning {
  447. background: #fff4e4 !important;
  448. color: #493107 !important;
  449. }
  450. .ui.selectable.table tr.active:hover,
  451. .ui.table tr td.selectable.active:hover,
  452. .ui.selectable.table tr:hover td.active {
  453. background: #E0E0E0 !important;
  454. color: rgba(0, 0, 0, 0.87) !important;
  455. }
  456. .ui.selectable.table tr.positive:hover,
  457. .ui.table tr td.selectable.positive:hover,
  458. .ui.selectable.table tr:hover td.positive {
  459. background: #f7ffe6 !important;
  460. color: #275b28 !important;
  461. }
  462. .ui.selectable.table tr.negative:hover,
  463. .ui.table tr td.selectable.negative:hover,
  464. .ui.selectable.table tr:hover td.negative {
  465. background: #ffe7e7 !important;
  466. color: #943634 !important;
  467. }
  468. /*-------------------
  469. Attached
  470. --------------------*/
  471. /* Middle */
  472. .ui.attached.table {
  473. top: 0px;
  474. bottom: 0px;
  475. border-radius: 0px;
  476. margin: 0em -1px;
  477. width: calc(100% + 2px );
  478. max-width: calc(100% + 2px );
  479. box-shadow: none;
  480. border: 1px solid #D4D4D5;
  481. }
  482. .ui.attached + .ui.attached.table:not(.top) {
  483. border-top: none;
  484. }
  485. /* Top */
  486. .ui[class*="top attached"].table {
  487. bottom: 0px;
  488. margin-bottom: 0em;
  489. top: 0px;
  490. margin-top: 1em;
  491. border-radius: 0.28571429rem 0.28571429rem 0em 0em;
  492. }
  493. .ui.table[class*="top attached"]:first-child {
  494. margin-top: 0em;
  495. }
  496. /* Bottom */
  497. .ui[class*="bottom attached"].table {
  498. bottom: 0px;
  499. margin-top: 0em;
  500. top: 0px;
  501. margin-bottom: 1em;
  502. box-shadow: none, none;
  503. border-radius: 0em 0em 0.28571429rem 0.28571429rem;
  504. }
  505. .ui[class*="bottom attached"].table:last-child {
  506. margin-bottom: 0em;
  507. }
  508. /*--------------
  509. Striped
  510. ---------------*/
  511. /* Table Striping */
  512. .ui.striped.table > tr:nth-child(2n),
  513. .ui.striped.table tbody tr:nth-child(2n) {
  514. background-color: rgba(0, 0, 50, 0.02);
  515. }
  516. /* Stripes */
  517. .ui.inverted.striped.table > tr:nth-child(2n),
  518. .ui.inverted.striped.table tbody tr:nth-child(2n) {
  519. background-color: rgba(255, 255, 255, 0.05);
  520. }
  521. /* Allow striped active hover */
  522. .ui.striped.selectable.selectable.selectable.table tbody tr.active:hover {
  523. background: #EFEFEF !important;
  524. color: rgba(0, 0, 0, 0.95) !important;
  525. }
  526. /*--------------
  527. Single Line
  528. ---------------*/
  529. .ui.table[class*="single line"],
  530. .ui.table [class*="single line"] {
  531. white-space: nowrap;
  532. }
  533. .ui.table[class*="single line"],
  534. .ui.table [class*="single line"] {
  535. white-space: nowrap;
  536. }
  537. /*-------------------
  538. Colors
  539. --------------------*/
  540. /* Red */
  541. .ui.red.table {
  542. border-top: 0.2em solid #DB2828;
  543. }
  544. .ui.inverted.red.table {
  545. background-color: #DB2828 !important;
  546. color: #FFFFFF !important;
  547. }
  548. /* Orange */
  549. .ui.orange.table {
  550. border-top: 0.2em solid #F2711C;
  551. }
  552. .ui.inverted.orange.table {
  553. background-color: #F2711C !important;
  554. color: #FFFFFF !important;
  555. }
  556. /* Yellow */
  557. .ui.yellow.table {
  558. border-top: 0.2em solid #FBBD08;
  559. }
  560. .ui.inverted.yellow.table {
  561. background-color: #FBBD08 !important;
  562. color: #FFFFFF !important;
  563. }
  564. /* Olive */
  565. .ui.olive.table {
  566. border-top: 0.2em solid #B5CC18;
  567. }
  568. .ui.inverted.olive.table {
  569. background-color: #B5CC18 !important;
  570. color: #FFFFFF !important;
  571. }
  572. /* Green */
  573. .ui.green.table {
  574. border-top: 0.2em solid #21BA45;
  575. }
  576. .ui.inverted.green.table {
  577. background-color: #21BA45 !important;
  578. color: #FFFFFF !important;
  579. }
  580. /* Teal */
  581. .ui.teal.table {
  582. border-top: 0.2em solid #00B5AD;
  583. }
  584. .ui.inverted.teal.table {
  585. background-color: #00B5AD !important;
  586. color: #FFFFFF !important;
  587. }
  588. /* Blue */
  589. .ui.blue.table {
  590. border-top: 0.2em solid #2185D0;
  591. }
  592. .ui.inverted.blue.table {
  593. background-color: #2185D0 !important;
  594. color: #FFFFFF !important;
  595. }
  596. /* Violet */
  597. .ui.violet.table {
  598. border-top: 0.2em solid #6435C9;
  599. }
  600. .ui.inverted.violet.table {
  601. background-color: #6435C9 !important;
  602. color: #FFFFFF !important;
  603. }
  604. /* Purple */
  605. .ui.purple.table {
  606. border-top: 0.2em solid #A333C8;
  607. }
  608. .ui.inverted.purple.table {
  609. background-color: #A333C8 !important;
  610. color: #FFFFFF !important;
  611. }
  612. /* Pink */
  613. .ui.pink.table {
  614. border-top: 0.2em solid #E03997;
  615. }
  616. .ui.inverted.pink.table {
  617. background-color: #E03997 !important;
  618. color: #FFFFFF !important;
  619. }
  620. /* Brown */
  621. .ui.brown.table {
  622. border-top: 0.2em solid #A5673F;
  623. }
  624. .ui.inverted.brown.table {
  625. background-color: #A5673F !important;
  626. color: #FFFFFF !important;
  627. }
  628. /* Grey */
  629. .ui.grey.table {
  630. border-top: 0.2em solid #767676;
  631. }
  632. .ui.inverted.grey.table {
  633. background-color: #767676 !important;
  634. color: #FFFFFF !important;
  635. }
  636. /* Black */
  637. .ui.black.table {
  638. border-top: 0.2em solid #1B1C1D;
  639. }
  640. .ui.inverted.black.table {
  641. background-color: #1B1C1D !important;
  642. color: #FFFFFF !important;
  643. }
  644. /*--------------
  645. Column Count
  646. ---------------*/
  647. /* Grid Based */
  648. .ui.one.column.table td {
  649. width: 100%;
  650. }
  651. .ui.two.column.table td {
  652. width: 50%;
  653. }
  654. .ui.three.column.table td {
  655. width: 33.33333333%;
  656. }
  657. .ui.four.column.table td {
  658. width: 25%;
  659. }
  660. .ui.five.column.table td {
  661. width: 20%;
  662. }
  663. .ui.six.column.table td {
  664. width: 16.66666667%;
  665. }
  666. .ui.seven.column.table td {
  667. width: 14.28571429%;
  668. }
  669. .ui.eight.column.table td {
  670. width: 12.5%;
  671. }
  672. .ui.nine.column.table td {
  673. width: 11.11111111%;
  674. }
  675. .ui.ten.column.table td {
  676. width: 10%;
  677. }
  678. .ui.eleven.column.table td {
  679. width: 9.09090909%;
  680. }
  681. .ui.twelve.column.table td {
  682. width: 8.33333333%;
  683. }
  684. .ui.thirteen.column.table td {
  685. width: 7.69230769%;
  686. }
  687. .ui.fourteen.column.table td {
  688. width: 7.14285714%;
  689. }
  690. .ui.fifteen.column.table td {
  691. width: 6.66666667%;
  692. }
  693. .ui.sixteen.column.table td {
  694. width: 6.25%;
  695. }
  696. /* Column Width */
  697. .ui.table th.one.wide,
  698. .ui.table td.one.wide {
  699. width: 6.25%;
  700. }
  701. .ui.table th.two.wide,
  702. .ui.table td.two.wide {
  703. width: 12.5%;
  704. }
  705. .ui.table th.three.wide,
  706. .ui.table td.three.wide {
  707. width: 18.75%;
  708. }
  709. .ui.table th.four.wide,
  710. .ui.table td.four.wide {
  711. width: 25%;
  712. }
  713. .ui.table th.five.wide,
  714. .ui.table td.five.wide {
  715. width: 31.25%;
  716. }
  717. .ui.table th.six.wide,
  718. .ui.table td.six.wide {
  719. width: 37.5%;
  720. }
  721. .ui.table th.seven.wide,
  722. .ui.table td.seven.wide {
  723. width: 43.75%;
  724. }
  725. .ui.table th.eight.wide,
  726. .ui.table td.eight.wide {
  727. width: 50%;
  728. }
  729. .ui.table th.nine.wide,
  730. .ui.table td.nine.wide {
  731. width: 56.25%;
  732. }
  733. .ui.table th.ten.wide,
  734. .ui.table td.ten.wide {
  735. width: 62.5%;
  736. }
  737. .ui.table th.eleven.wide,
  738. .ui.table td.eleven.wide {
  739. width: 68.75%;
  740. }
  741. .ui.table th.twelve.wide,
  742. .ui.table td.twelve.wide {
  743. width: 75%;
  744. }
  745. .ui.table th.thirteen.wide,
  746. .ui.table td.thirteen.wide {
  747. width: 81.25%;
  748. }
  749. .ui.table th.fourteen.wide,
  750. .ui.table td.fourteen.wide {
  751. width: 87.5%;
  752. }
  753. .ui.table th.fifteen.wide,
  754. .ui.table td.fifteen.wide {
  755. width: 93.75%;
  756. }
  757. .ui.table th.sixteen.wide,
  758. .ui.table td.sixteen.wide {
  759. width: 100%;
  760. }
  761. /*--------------
  762. Sortable
  763. ---------------*/
  764. .ui.sortable.table thead th {
  765. cursor: pointer;
  766. white-space: nowrap;
  767. border-left: 1px solid rgba(34, 36, 38, 0.15);
  768. color: rgba(0, 0, 0, 0.87);
  769. }
  770. .ui.sortable.table thead th:first-child {
  771. border-left: none;
  772. }
  773. .ui.sortable.table thead th.sorted,
  774. .ui.sortable.table thead th.sorted:hover {
  775. -webkit-user-select: none;
  776. -moz-user-select: none;
  777. -ms-user-select: none;
  778. user-select: none;
  779. }
  780. .ui.sortable.table thead th:after {
  781. display: none;
  782. font-style: normal;
  783. font-weight: normal;
  784. text-decoration: inherit;
  785. content: '';
  786. height: 1em;
  787. width: auto;
  788. opacity: 0.8;
  789. margin: 0em 0em 0em 0.5em;
  790. font-family: 'Icons';
  791. }
  792. .ui.sortable.table thead th.ascending:after {
  793. content: '\f0d8';
  794. }
  795. .ui.sortable.table thead th.descending:after {
  796. content: '\f0d7';
  797. }
  798. /* Hover */
  799. .ui.sortable.table th.disabled:hover {
  800. cursor: auto;
  801. color: rgba(40, 40, 40, 0.3);
  802. }
  803. .ui.sortable.table thead th:hover {
  804. background: rgba(0, 0, 0, 0.05);
  805. color: rgba(0, 0, 0, 0.8);
  806. }
  807. /* Sorted */
  808. .ui.sortable.table thead th.sorted {
  809. background: rgba(0, 0, 0, 0.05);
  810. color: rgba(0, 0, 0, 0.95);
  811. }
  812. .ui.sortable.table thead th.sorted:after {
  813. display: inline-block;
  814. }
  815. /* Sorted Hover */
  816. .ui.sortable.table thead th.sorted:hover {
  817. background: rgba(0, 0, 0, 0.05);
  818. color: rgba(0, 0, 0, 0.95);
  819. }
  820. /* Inverted */
  821. .ui.inverted.sortable.table thead th.sorted {
  822. background: rgba(255, 255, 255, 0.15) -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  823. background: rgba(255, 255, 255, 0.15) linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  824. color: #ffffff;
  825. }
  826. .ui.inverted.sortable.table thead th:hover {
  827. background: rgba(255, 255, 255, 0.08) -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  828. background: rgba(255, 255, 255, 0.08) linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  829. color: #ffffff;
  830. }
  831. .ui.inverted.sortable.table thead th {
  832. border-left-color: transparent;
  833. border-right-color: transparent;
  834. }
  835. /*--------------
  836. Inverted
  837. ---------------*/
  838. /* Text Color */
  839. .ui.inverted.table {
  840. background: #333333;
  841. color: rgba(255, 255, 255, 0.9);
  842. border: none;
  843. }
  844. .ui.inverted.table th {
  845. background-color: rgba(0, 0, 0, 0.15);
  846. border-color: rgba(255, 255, 255, 0.1) !important;
  847. color: rgba(255, 255, 255, 0.9);
  848. }
  849. .ui.inverted.table tr td {
  850. border-color: rgba(255, 255, 255, 0.1) !important;
  851. }
  852. .ui.inverted.table tr.disabled td,
  853. .ui.inverted.table tr td.disabled,
  854. .ui.inverted.table tr.disabled:hover td,
  855. .ui.inverted.table tr:hover td.disabled {
  856. pointer-events: none;
  857. color: rgba(225, 225, 225, 0.3);
  858. }
  859. /* Definition */
  860. .ui.inverted.definition.table tfoot:not(.full-width) th:first-child,
  861. .ui.inverted.definition.table thead:not(.full-width) th:first-child {
  862. background: #FFFFFF;
  863. }
  864. .ui.inverted.definition.table tr td:first-child {
  865. background: rgba(255, 255, 255, 0.02);
  866. color: #ffffff;
  867. }
  868. /*--------------
  869. Collapsing
  870. ---------------*/
  871. .ui.collapsing.table {
  872. width: auto;
  873. }
  874. /*--------------
  875. Basic
  876. ---------------*/
  877. .ui.basic.table {
  878. background: transparent;
  879. border: 1px solid rgba(34, 36, 38, 0.15);
  880. box-shadow: none;
  881. }
  882. .ui.basic.table thead,
  883. .ui.basic.table tfoot {
  884. box-shadow: none;
  885. }
  886. .ui.basic.table th {
  887. background: transparent;
  888. border-left: none;
  889. }
  890. .ui.basic.table tbody tr {
  891. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  892. }
  893. .ui.basic.table td {
  894. background: transparent;
  895. }
  896. .ui.basic.striped.table tbody tr:nth-child(2n) {
  897. background-color: rgba(0, 0, 0, 0.05) !important;
  898. }
  899. /* Very Basic */
  900. .ui[class*="very basic"].table {
  901. border: none;
  902. }
  903. .ui[class*="very basic"].table:not(.sortable):not(.striped) th,
  904. .ui[class*="very basic"].table:not(.sortable):not(.striped) td {
  905. padding: '';
  906. }
  907. .ui[class*="very basic"].table:not(.sortable):not(.striped) th:first-child,
  908. .ui[class*="very basic"].table:not(.sortable):not(.striped) td:first-child {
  909. padding-left: 0em;
  910. }
  911. .ui[class*="very basic"].table:not(.sortable):not(.striped) th:last-child,
  912. .ui[class*="very basic"].table:not(.sortable):not(.striped) td:last-child {
  913. padding-right: 0em;
  914. }
  915. .ui[class*="very basic"].table:not(.sortable):not(.striped) thead tr:first-child th {
  916. padding-top: 0em;
  917. }
  918. /*--------------
  919. Celled
  920. ---------------*/
  921. .ui.celled.table tr th,
  922. .ui.celled.table tr td {
  923. border-left: 1px solid rgba(34, 36, 38, 0.1);
  924. }
  925. .ui.celled.table tr th:first-child,
  926. .ui.celled.table tr td:first-child {
  927. border-left: none;
  928. }
  929. /*--------------
  930. Padded
  931. ---------------*/
  932. .ui.padded.table th {
  933. padding-left: 1em;
  934. padding-right: 1em;
  935. }
  936. .ui.padded.table th,
  937. .ui.padded.table td {
  938. padding: 1em 1em;
  939. }
  940. /* Very */
  941. .ui[class*="very padded"].table th {
  942. padding-left: 1.5em;
  943. padding-right: 1.5em;
  944. }
  945. .ui[class*="very padded"].table td {
  946. padding: 1.5em 1.5em;
  947. }
  948. /*--------------
  949. Compact
  950. ---------------*/
  951. .ui.compact.table th {
  952. padding-left: 0.7em;
  953. padding-right: 0.7em;
  954. }
  955. .ui.compact.table td {
  956. padding: 0.5em 0.7em;
  957. }
  958. /* Very */
  959. .ui[class*="very compact"].table th {
  960. padding-left: 0.6em;
  961. padding-right: 0.6em;
  962. }
  963. .ui[class*="very compact"].table td {
  964. padding: 0.4em 0.6em;
  965. }
  966. /*--------------
  967. Sizes
  968. ---------------*/
  969. /* Small */
  970. .ui.small.table {
  971. font-size: 0.9em;
  972. }
  973. /* Standard */
  974. .ui.table {
  975. font-size: 1em;
  976. }
  977. /* Large */
  978. .ui.large.table {
  979. font-size: 1.1em;
  980. }
  981. /*******************************
  982. Site Overrides
  983. *******************************/