table.css 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. .ui-table {
  2. position: relative;
  3. }
  4. .ui-table table {
  5. border-collapse: collapse;
  6. width: 100%;
  7. table-layout: fixed;
  8. }
  9. .ui-table .ui-table-thead > tr > th,
  10. .ui-table .ui-table-tbody > tr > td,
  11. .ui-table .ui-table-tfoot > tr > td {
  12. padding: .25em .5em;
  13. }
  14. .ui-table .ui-sortable-column {
  15. cursor: pointer;
  16. }
  17. .ui-table p-sorticon {
  18. vertical-align: middle;
  19. }
  20. .ui-table-auto-layout > .ui-table-wrapper {
  21. overflow-x: auto;
  22. }
  23. .ui-table-auto-layout > .ui-table-wrapper > table {
  24. table-layout: auto;
  25. }
  26. /* Sections */
  27. .ui-table-caption,
  28. .ui-table-summary {
  29. padding: .25em .5em;
  30. text-align: center;
  31. font-weight: bold;
  32. }
  33. .ui-table-caption {
  34. border-bottom: 0 none;
  35. }
  36. .ui-table-summary {
  37. border-top: 0 none;
  38. }
  39. /* Paginator */
  40. .ui-table .ui-paginator-top {
  41. border-bottom: 0 none;
  42. }
  43. .ui-table .ui-paginator-bottom {
  44. border-top: 0 none;
  45. }
  46. /* Scrollable */
  47. .ui-table-scrollable-wrapper {
  48. position: relative;
  49. }
  50. .ui-table-scrollable-header,
  51. .ui-table-scrollable-footer {
  52. overflow: hidden;
  53. border: 0 none;
  54. }
  55. .ui-table-scrollable-body {
  56. overflow: auto;
  57. position: relative;
  58. }
  59. .ui-table-virtual-table {
  60. position: absolute;
  61. }
  62. .ui-table-loading-virtual-table {
  63. display: none;
  64. }
  65. /* Frozen Columns */
  66. .ui-table-frozen-view .ui-table-scrollable-body {
  67. overflow: hidden;
  68. }
  69. .ui-table-frozen-view > .ui-table-scrollable-body > table > .ui-table-tbody > tr > td:last-child {
  70. border-right: 0 none;
  71. }
  72. .ui-table-unfrozen-view {
  73. position: absolute;
  74. top: 0px;
  75. }
  76. /* Resizable */
  77. .ui-table-resizable > .ui-table-wrapper {
  78. overflow-x: auto;
  79. }
  80. .ui-table-resizable .ui-table-thead > tr > th,
  81. .ui-table-resizable .ui-table-tfoot > tr > td,
  82. .ui-table-resizable .ui-table-tbody > tr > td {
  83. overflow: hidden;
  84. }
  85. .ui-table-resizable .ui-resizable-column {
  86. background-clip: padding-box;
  87. position: relative;
  88. }
  89. .ui-table-resizable-fit .ui-resizable-column:last-child .ui-column-resizer {
  90. display: none;
  91. }
  92. .ui-table .ui-column-resizer {
  93. display: block;
  94. position: absolute !important;
  95. top: 0;
  96. right: 0;
  97. margin: 0;
  98. width: .5em;
  99. height: 100%;
  100. padding: 0px;
  101. cursor:col-resize;
  102. border: 1px solid transparent;
  103. }
  104. .ui-table .ui-column-resizer-helper {
  105. width: 1px;
  106. position: absolute;
  107. z-index: 10;
  108. display: none;
  109. }
  110. /* Edit */
  111. .ui-table .ui-table-tbody > tr > td.ui-editing-cell {
  112. padding: 0;
  113. }
  114. .ui-table .ui-table-tbody > tr > td.ui-editing-cell p-celleditor > * {
  115. width: 100%;
  116. }
  117. /* Reorder */
  118. .ui-table-reorder-indicator-up,
  119. .ui-table-reorder-indicator-down {
  120. position: absolute;
  121. display: none;
  122. }
  123. /* Responsive */
  124. .ui-table-responsive .ui-table-tbody > tr > td .ui-column-title {
  125. display: none;
  126. }
  127. @media screen and (max-width: 40em) {
  128. .ui-table-responsive .ui-table-thead > tr > th,
  129. .ui-table-responsive .ui-table-tfoot > tr > td {
  130. display: none !important;
  131. }
  132. .ui-table-responsive colgroup {
  133. display: none !important;
  134. }
  135. .ui-table-responsive .ui-table-tbody > tr > td {
  136. text-align: left;
  137. display: block;
  138. border: 0 none;
  139. width: 100% !important;
  140. -webkit-box-sizing: border-box;
  141. -moz-box-sizing: border-box;
  142. box-sizing: border-box;
  143. float: left;
  144. clear: left;
  145. }
  146. .ui-table-responsive .ui-table-tbody > tr > td .ui-column-title {
  147. padding: .4em;
  148. min-width: 30%;
  149. display: inline-block;
  150. margin: -.4em 1em -.4em -.4em;
  151. font-weight: bold;
  152. }
  153. }
  154. /* Loader */
  155. .ui-table-loading {
  156. position: absolute;
  157. width: 100%;
  158. height: 100%;
  159. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
  160. opacity: 0.1;
  161. z-index: 1;
  162. }
  163. .ui-table-loading-content {
  164. position: absolute;
  165. left: 50%;
  166. top: 50%;
  167. z-index: 2;
  168. margin-top: -1em;
  169. margin-left: -1em;
  170. }
  171. .ui-table .ui-table-loading-icon {
  172. font-size: 2em;
  173. }