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.

789 lines
18 KiB

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
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
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
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
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
  1. /*
  2. * # Semantic - Table
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Copyright 2013 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. /*******************************
  12. Theme
  13. *******************************/
  14. /*
  15. */
  16. /*******************************
  17. Folders
  18. *******************************/
  19. /* Path to theme packages */
  20. /* Path to site override folder */
  21. /*******************************
  22. Themes
  23. *******************************/
  24. /* To override a theme for an individual element
  25. specify theme name below
  26. Be sure to update the user folder name (see README)
  27. */
  28. /* Global */
  29. /* Elements */
  30. /* Collections */
  31. /* Modules */
  32. /* Views */
  33. /*******************************
  34. Import Directives
  35. *******************************/
  36. /*------------------
  37. Load Default
  38. -------------------*/
  39. /*******************************
  40. Global Variables
  41. *******************************/
  42. /*-------------------
  43. Paths
  44. --------------------*/
  45. /*-------------------
  46. Page
  47. --------------------*/
  48. /*-------------------
  49. Grid
  50. --------------------*/
  51. /*-------------------
  52. Breakpoints
  53. --------------------*/
  54. /*-------------------
  55. Fonts
  56. --------------------*/
  57. /*-------------------
  58. Icons
  59. --------------------*/
  60. /* Max Width of Icon */
  61. /*-------------------
  62. Easing
  63. --------------------*/
  64. /*******************************
  65. BG Colors
  66. *******************************/
  67. /*******************************
  68. Colors
  69. *******************************/
  70. /*--- Colors ---*/
  71. /*--- Neutrals ---*/
  72. /*--- Text Colors ---*/
  73. /* Preserve */
  74. /* Adjust for Legibility */
  75. /*--- Backgrounds ---*/
  76. /*-------------------
  77. Emotive Colors
  78. --------------------*/
  79. /* Positive / Negative */
  80. /* Messages */
  81. /*-------------------
  82. Text Colors
  83. --------------------*/
  84. /*-------------------
  85. Brand Colors
  86. --------------------*/
  87. /*-------------------
  88. Borders
  89. --------------------*/
  90. /*-------------------
  91. Sizes
  92. --------------------*/
  93. /*-------------------
  94. Transitions
  95. --------------------*/
  96. /*******************************
  97. States
  98. *******************************/
  99. /*-------------------
  100. Disabled
  101. --------------------*/
  102. /*-------------------
  103. Hover
  104. --------------------*/
  105. /*--- Colors ---*/
  106. /*--- Emotive ---*/
  107. /*--- Neutrals ---*/
  108. /*-------------------
  109. Down (:active)
  110. --------------------*/
  111. /*--- Colors ---*/
  112. /*--- Emotive ---*/
  113. /*--- Neutrals ---*/
  114. /*-------------------
  115. Active
  116. --------------------*/
  117. /*--- Standard ---*/
  118. /*--- Emotive ---*/
  119. /*--- Neutrals ---*/
  120. /*-------------------
  121. Collection
  122. --------------------*/
  123. /*--------------
  124. Elements
  125. ---------------*/
  126. /* Table Row */
  127. /* Table Cell */
  128. /* Table Header */
  129. /* Table Footer */
  130. /* Responsive Size */
  131. /*--------------
  132. Couplings
  133. ---------------*/
  134. /*--------------
  135. States
  136. ---------------*/
  137. /* Positive */
  138. /* Negative */
  139. /* Error */
  140. /* Warning */
  141. /* Active */
  142. /*--------------
  143. Types
  144. ---------------*/
  145. /* Striped */
  146. /* Sortable */
  147. /* Colors */
  148. /* Inverted */
  149. /* Definition */
  150. /* Basic */
  151. /* Padded */
  152. /* Sizes */
  153. /*------------------
  154. Load Theme
  155. -------------------*/
  156. /*------------------
  157. Load Site
  158. -------------------*/
  159. /*******************************
  160. User Global Variables
  161. *******************************/
  162. /*******************************
  163. User Variable Overrides
  164. *******************************/
  165. /*------------------
  166. Override Mix-in
  167. -------------------*/
  168. /*******************************
  169. Table
  170. *******************************/
  171. /* Prototype */
  172. .ui.table {
  173. width: 100%;
  174. background: #ffffff;
  175. border: 1px solid #dddddd;
  176. -webkit-box-shadow: none;
  177. box-shadow: none;
  178. border-radius: 0.25rem;
  179. color: rgba(0, 0, 0, 0.8);
  180. }
  181. .ui.table {
  182. border-collapse: separate;
  183. border-spacing: 0px;
  184. }
  185. /* Table Content */
  186. .ui.table th,
  187. .ui.table td {
  188. -webkit-transition: all 0.2s 'ease';
  189. transition: all 0.2s 'ease';
  190. }
  191. /* Headers */
  192. .ui.table thead th {
  193. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  194. cursor: auto;
  195. background-color: transparent;
  196. text-align: left;
  197. color: rgba(0, 0, 0, 0.8);
  198. padding: 0.7em 0.8em;
  199. vertical-align: middle;
  200. font-style: none;
  201. font-weight: bold;
  202. text-transform: none;
  203. }
  204. .ui.table thead th:first-child {
  205. border-radius: 0.25rem 0em 0em 0em;
  206. }
  207. .ui.table thead th:last-child {
  208. border-radius: 0em 0.25rem 0em 0em;
  209. }
  210. /* Footer */
  211. .ui.table tfoot th {
  212. cursor: auto;
  213. border-top: 1px solid rgba(0, 0, 0, 0.1);
  214. background-color: rgba(0, 0, 0, 0.05);
  215. text-align: left;
  216. color: rgba(0, 0, 0, 0.8);
  217. padding: 1em 0.8em;
  218. vertical-align: middle;
  219. font-style: italic;
  220. font-weight: normal;
  221. text-transform: none;
  222. }
  223. .ui.table tfoot th:first-child {
  224. border-radius: 0em 0em 0em 0.25rem;
  225. }
  226. .ui.table tfoot th:last-child {
  227. border-radius: 0em 0em 0.25rem 0em;
  228. }
  229. /* Table Row */
  230. .ui.table tr td {
  231. border-top: 1px solid #dddddd;
  232. }
  233. .ui.table tr:first-child td {
  234. border-top: none;
  235. }
  236. /* Table Cells */
  237. .ui.table td {
  238. padding: 0.7em 0.8em;
  239. vertical-align: middle;
  240. }
  241. /* Icons */
  242. .ui.table > .icon {
  243. vertical-align: baseline;
  244. }
  245. .ui.table > .icon:only-child {
  246. margin: 0em;
  247. }
  248. /* Table Segment */
  249. .ui.table.segment {
  250. padding: 0em;
  251. }
  252. .ui.table.segment:after {
  253. display: none;
  254. }
  255. .ui.table.segment.stacked:after {
  256. display: block;
  257. }
  258. /* Responsive */
  259. @media only screen and (max-width: 768px) {
  260. .ui.table {
  261. display: block;
  262. padding: 0em;
  263. }
  264. .ui.table thead {
  265. display: none;
  266. }
  267. .ui.table tfoot {
  268. display: none;
  269. }
  270. .ui.table tbody {
  271. display: block;
  272. }
  273. .ui.table tr {
  274. display: block;
  275. }
  276. .ui.table tr > td {
  277. width: 100% !important;
  278. display: block;
  279. border: none !important;
  280. padding: 0.25em 0.75em;
  281. -webkit-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.05);
  282. box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.05);
  283. }
  284. .ui.table td:first-child {
  285. font-weight: bold;
  286. padding-top: 1em;
  287. }
  288. .ui.table td:last-child {
  289. -webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
  290. box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset;
  291. padding-bottom: 1em;
  292. }
  293. /* Clear BG Colors */
  294. .ui.table tr > td.warning,
  295. .ui.table tr > td.error,
  296. .ui.table tr > td.active,
  297. .ui.table tr > td.positive,
  298. .ui.table tr > td.negative {
  299. background-color: transparent !important;
  300. }
  301. }
  302. /*******************************
  303. States
  304. *******************************/
  305. /*--------------
  306. Positive
  307. ---------------*/
  308. .ui.table tr.positive,
  309. .ui.table td.positive {
  310. -webkit-box-shadow: 2px 0px 0px #119000 inset;
  311. box-shadow: 2px 0px 0px #119000 inset;
  312. }
  313. .ui.table tr.positive td,
  314. .ui.table td.positive {
  315. background: #f2f8f0 !important;
  316. color: #119000 !important;
  317. }
  318. .ui.celled.table tr.positive:hover td,
  319. .ui.celled.table tr:hover td.positive,
  320. .ui.table tr.positive:hover td,
  321. .ui.table td:hover.positive,
  322. .ui.table th:hover.positive {
  323. background: #ecf5e9 !important;
  324. color: #119000 !important;
  325. }
  326. /*--------------
  327. Negative
  328. ---------------*/
  329. .ui.table tr.negative,
  330. .ui.table td.negative {
  331. -webkit-box-shadow: 2px 0px 0px #cd2929 inset;
  332. box-shadow: 2px 0px 0px #cd2929 inset;
  333. }
  334. .ui.table tr.negative td,
  335. .ui.table td.negative {
  336. background: #f9f4f4 !important;
  337. color: #cd2929 !important;
  338. }
  339. .ui.celled.table tr.negative:hover td,
  340. .ui.celled.table tr:hover td.negative,
  341. .ui.table tr.negative:hover td,
  342. .ui.table td:hover.negative,
  343. .ui.table th:hover.negative {
  344. background: #f2e8e8 !important;
  345. color: #cd2929 !important;
  346. }
  347. /*--------------
  348. Error
  349. ---------------*/
  350. .ui.table tr.error,
  351. .ui.table td.error {
  352. -webkit-box-shadow: 2px 0px 0px #cd2929 inset;
  353. box-shadow: 2px 0px 0px #cd2929 inset;
  354. }
  355. .ui.table tr.error td,
  356. .ui.table td.error {
  357. background: #f9f4f4 !important;
  358. color: #cd2929 !important;
  359. }
  360. .ui.celled.table tr.error:hover td,
  361. .ui.celled.table tr:hover td.error,
  362. .ui.table tr.error:hover td,
  363. .ui.table td:hover.error,
  364. .ui.table th:hover.error {
  365. background: #f2e8e8 !important;
  366. color: #cd2929 !important;
  367. }
  368. /*--------------
  369. Warning
  370. ---------------*/
  371. .ui.table tr.warning,
  372. .ui.table td.warning {
  373. -webkit-box-shadow: 2px 0px 0px #7d6c00 inset;
  374. box-shadow: 2px 0px 0px #7d6c00 inset;
  375. }
  376. .ui.table tr.warning td,
  377. .ui.table td.warning {
  378. background: #fbf6e9 !important;
  379. color: #7d6c00 !important;
  380. }
  381. .ui.celled.table tr.warning:hover td,
  382. .ui.celled.table tr:hover td.warning,
  383. .ui.table tr.warning:hover td,
  384. .ui.table td:hover.warning,
  385. .ui.table th:hover.warning {
  386. background: #f3eddc !important;
  387. color: #cd2929 !important;
  388. }
  389. /*--------------
  390. Active
  391. ---------------*/
  392. .ui.table tr.active,
  393. .ui.table td.active {
  394. -webkit-box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
  395. box-shadow: 2px 0px 0px rgba(50, 50, 50, 0.9) inset;
  396. }
  397. .ui.table tr.active td,
  398. .ui.table td.active {
  399. background: #e0e0e0 !important;
  400. color: rgba(50, 50, 50, 0.9) !important;
  401. }
  402. .ui.celled.table tr.active:hover td,
  403. .ui.celled.table tr:hover td.active,
  404. .ui.table tr.active:hover td,
  405. .ui.table td:hover.active,
  406. .ui.table th:hover.active {
  407. background: #f3eddc !important;
  408. color: #cd2929 !important;
  409. }
  410. /*--------------
  411. Disabled
  412. ---------------*/
  413. .ui.table tr.disabled td,
  414. .ui.table tr td.disabled,
  415. .ui.table tr.disabled:hover td,
  416. .ui.table tr:hover td.disabled {
  417. color: rgba(150, 150, 150, 0.3);
  418. }
  419. /*******************************
  420. Variations
  421. *******************************/
  422. /*--------------
  423. Striped
  424. ---------------*/
  425. /* Table Striping */
  426. .ui.striped.table > tr:nth-child(2n),
  427. .ui.striped.table tbody tr:nth-child(2n) {
  428. background-color: rgba(0, 0, 50, 0.03);
  429. }
  430. /* Stripes */
  431. .ui.inverted.striped.table > tr:nth-child(2n),
  432. .ui.inverted.striped.table tbody tr:nth-child(2n) {
  433. background-color: rgba(255, 255, 255, 0.06);
  434. }
  435. /*-------------------
  436. Colors
  437. --------------------*/
  438. .ui.black.table {
  439. border-top: 0.2em solid #333333;
  440. border-radius: 0em;
  441. }
  442. .ui.blue.table {
  443. border-top: 0.2em solid #0074d9;
  444. border-radius: 0em;
  445. }
  446. .ui.green.table {
  447. border-top: 0.2em solid #2ecc40;
  448. border-radius: 0em;
  449. }
  450. .ui.orange.table {
  451. border-top: 0.2em solid #ff851b;
  452. border-radius: 0em;
  453. }
  454. .ui.pink.table {
  455. border-top: 0.2em solid #d9499a;
  456. border-radius: 0em;
  457. }
  458. .ui.purple.table {
  459. border-top: 0.2em solid #564f8a;
  460. border-radius: 0em;
  461. }
  462. .ui.red.table {
  463. border-top: 0.2em solid #ff4136;
  464. border-radius: 0em;
  465. }
  466. .ui.teal.table {
  467. border-top: 0.2em solid #39cccc;
  468. border-radius: 0em;
  469. }
  470. .ui.yellow.table {
  471. border-top: 0.2em solid #ffcb08;
  472. border-radius: 0em;
  473. }
  474. /*-------------------
  475. Inverted Colors
  476. --------------------*/
  477. .ui.inverted.table,
  478. .ui.inverted.black.table {
  479. background-color: #333333 !important;
  480. border-radius: 0.25rem;
  481. color: #ffffff !important;
  482. }
  483. .ui.inverted.blue.table {
  484. background-color: #0074d9 !important;
  485. border-radius: 0.25rem;
  486. color: #ffffff !important;
  487. }
  488. .ui.inverted.green.table {
  489. background-color: #2ecc40 !important;
  490. border-radius: 0.25rem;
  491. color: #ffffff !important;
  492. }
  493. .ui.inverted.orange.table {
  494. background-color: #ff851b !important;
  495. border-radius: 0.25rem;
  496. color: #ffffff !important;
  497. }
  498. .ui.inverted.pink.table {
  499. background-color: #d9499a !important;
  500. border-radius: 0.25rem;
  501. color: #ffffff !important;
  502. }
  503. .ui.inverted.purple.table {
  504. background-color: #564f8a !important;
  505. border-radius: 0.25rem;
  506. color: #ffffff !important;
  507. }
  508. .ui.inverted.red.table {
  509. background-color: #ff4136 !important;
  510. border-radius: 0.25rem;
  511. color: #ffffff !important;
  512. }
  513. .ui.inverted.teal.table {
  514. background-color: #39cccc !important;
  515. border-radius: 0.25rem;
  516. color: #ffffff !important;
  517. }
  518. .ui.inverted.yellow.table {
  519. background-color: #ffcb08 !important;
  520. border-radius: 0.25rem;
  521. color: #ffffff !important;
  522. }
  523. /*--------------
  524. Column Count
  525. ---------------*/
  526. /* Grid Based */
  527. .ui.one.column.table td {
  528. width: 100%;
  529. }
  530. .ui.two.column.table td {
  531. width: 50%;
  532. }
  533. .ui.three.column.table td {
  534. width: 33.33333333%;
  535. }
  536. .ui.four.column.table td {
  537. width: 25%;
  538. }
  539. .ui.five.column.table td {
  540. width: 20%;
  541. }
  542. .ui.six.column.table td {
  543. width: 16.66666667%;
  544. }
  545. .ui.seven.column.table td {
  546. width: 14.28571429%;
  547. }
  548. .ui.eight.column.table td {
  549. width: 12.5%;
  550. }
  551. .ui.nine.column.table td {
  552. width: 11.11111111%;
  553. }
  554. .ui.ten.column.table td {
  555. width: 10%;
  556. }
  557. .ui.eleven.column.table td {
  558. width: 9.09090909%;
  559. }
  560. .ui.twelve.column.table td {
  561. width: 8.33333333%;
  562. }
  563. .ui.thirteen.column.table td {
  564. width: 7.69230769%;
  565. }
  566. .ui.fourteen.column.table td {
  567. width: 7.14285714%;
  568. }
  569. .ui.fifteen.column.table td {
  570. width: 6.66666667%;
  571. }
  572. .ui.sixteen.column.table td {
  573. width: 6.25%;
  574. }
  575. /* Column Width */
  576. .ui.table th.one.wide,
  577. .ui.table td.one.wide {
  578. width: 6.25%;
  579. }
  580. .ui.table th.two.wide,
  581. .ui.table td.two.wide {
  582. width: 12.5%;
  583. }
  584. .ui.table th.three.wide,
  585. .ui.table td.three.wide {
  586. width: 18.75%;
  587. }
  588. .ui.table th.four.wide,
  589. .ui.table td.four.wide {
  590. width: 25%;
  591. }
  592. .ui.table th.five.wide,
  593. .ui.table td.five.wide {
  594. width: 31.25%;
  595. }
  596. .ui.table th.six.wide,
  597. .ui.table td.six.wide {
  598. width: 37.5%;
  599. }
  600. .ui.table th.seven.wide,
  601. .ui.table td.seven.wide {
  602. width: 43.75%;
  603. }
  604. .ui.table th.eight.wide,
  605. .ui.table td.eight.wide {
  606. width: 50%;
  607. }
  608. .ui.table th.nine.wide,
  609. .ui.table td.nine.wide {
  610. width: 56.25%;
  611. }
  612. .ui.table th.ten.wide,
  613. .ui.table td.ten.wide {
  614. width: 62.5%;
  615. }
  616. .ui.table th.eleven.wide,
  617. .ui.table td.eleven.wide {
  618. width: 68.75%;
  619. }
  620. .ui.table th.twelve.wide,
  621. .ui.table td.twelve.wide {
  622. width: 75%;
  623. }
  624. .ui.table th.thirteen.wide,
  625. .ui.table td.thirteen.wide {
  626. width: 81.25%;
  627. }
  628. .ui.table th.fourteen.wide,
  629. .ui.table td.fourteen.wide {
  630. width: 87.5%;
  631. }
  632. .ui.table th.fifteen.wide,
  633. .ui.table td.fifteen.wide {
  634. width: 93.75%;
  635. }
  636. .ui.table th.sixteen.wide,
  637. .ui.table td.sixteen.wide {
  638. width: 100%;
  639. }
  640. /*--------------
  641. Celled
  642. ---------------*/
  643. .ui.celled.table th,
  644. .ui.celled.table td {
  645. border-left: 1px solid #dddddd;
  646. }
  647. .ui.celled.table th:first-child,
  648. .ui.celled.table td:first-child {
  649. border-left: none;
  650. }
  651. /*--------------
  652. Sortable
  653. ---------------*/
  654. .ui.sortable.table thead th {
  655. cursor: pointer;
  656. white-space: nowrap;
  657. color: rgba(0, 0, 0, 0.8);
  658. }
  659. .ui.sortable.table thead th.sorted,
  660. .ui.sortable.table thead th.sorted:hover {
  661. -webkit-user-select: none;
  662. -moz-user-select: none;
  663. -ms-user-select: none;
  664. user-select: none;
  665. }
  666. .ui.sortable.table thead th:after {
  667. display: inline-block;
  668. content: '';
  669. width: 1em;
  670. opacity: 0.8;
  671. margin: 0em 0em 0em 0.5em;
  672. font-family: 'Icons';
  673. font-style: normal;
  674. font-weight: normal;
  675. text-decoration: inherit;
  676. }
  677. .ui.sortable.table thead th.ascending:after {
  678. content: '\f0d7';
  679. }
  680. .ui.sortable.table thead th.descending:after {
  681. content: '\f0d8';
  682. }
  683. /* Sortable Hover */
  684. .ui.sortable.table th.disabled:hover {
  685. cursor: auto;
  686. color: rgba(0, 0, 0, 0.2);
  687. }
  688. .ui.sortable.table thead th:hover {
  689. background: rgba(0, 0, 0, 0.1);
  690. color: rgba(0, 0, 0, 0.8);
  691. }
  692. /* Inverted Sortable */
  693. .ui.inverted.sortable.table thead th:hover {
  694. background-color: rgba(255, 255, 255, 0.01);
  695. color: #ffffff;
  696. }
  697. /*--------------
  698. Inverted
  699. ---------------*/
  700. /* Text Color */
  701. .ui.inverted.table {
  702. background: #333333;
  703. color: #ffffff;
  704. border: none;
  705. }
  706. .ui.inverted.table th {
  707. background-color: rgba(0, 0, 0, 0.15);
  708. color: rgba(255, 255, 255, 0.9);
  709. }
  710. .ui.inverted.table tr td {
  711. border-color: rgba(0, 0, 0, 0.2);
  712. }
  713. /*--------------
  714. Definition
  715. ---------------*/
  716. .ui.definition.table td:first-child {
  717. background: '';
  718. font-weight: rgba(0, 0, 0, 0.8);
  719. color: rgba(0, 0, 0, 0.8);
  720. }
  721. /*--------------
  722. Collapsing
  723. ---------------*/
  724. .ui.collapsing.table {
  725. width: auto;
  726. }
  727. /*--------------
  728. Basic
  729. ---------------*/
  730. .ui.basic.table {
  731. background: transparent;
  732. border: none;
  733. }
  734. .ui.basic.table th {
  735. background-color: transparent;
  736. }
  737. .ui.basic.table tbody tr {
  738. border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  739. }
  740. .ui.basic.table td {
  741. background: transparent;
  742. }
  743. .ui.basic.table th,
  744. .ui.basic.table td {
  745. padding: 0.8em 0em;
  746. }
  747. .ui.basic.striped.table tbody tr:nth-child(2n) {
  748. background-color: transparent !important;
  749. }
  750. /*--------------
  751. Padded
  752. ---------------*/
  753. .ui.padded.table th,
  754. .ui.padded.table td {
  755. padding: 0.8em 1em;
  756. }
  757. .ui.compact.table td {
  758. padding: 0.5em 0.8em;
  759. }
  760. /*--------------
  761. Sizes
  762. ---------------*/
  763. /* Small */
  764. .ui.small.table {
  765. font-size: 0.875em;
  766. }
  767. /* Standard */
  768. .ui.table {
  769. font-size: 1em;
  770. }
  771. /* Large */
  772. .ui.large.table {
  773. font-size: 1.1em;
  774. }
  775. /*******************************
  776. Overrides
  777. *******************************/
  778. /*******************************
  779. Overrides
  780. *******************************/