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.

1062 lines
21 KiB

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