index.css 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198
  1. .ngx-datatable {
  2. display: block;
  3. overflow: hidden;
  4. justify-content: center;
  5. position: relative;
  6. -webkit-transform: translate3d(0, 0, 0);
  7. /**
  8. * Vertical Scrolling Adjustments
  9. */
  10. /**
  11. * Horizontal Scrolling Adjustments
  12. */
  13. /**
  14. * Fixed Header Height Adjustments
  15. */
  16. /**
  17. * Fixed row height adjustments
  18. */
  19. /**
  20. * Shared Styles
  21. */
  22. /**
  23. * Header Styles
  24. */
  25. /**
  26. * Body Styles
  27. */
  28. /**
  29. * Footer Styles
  30. */ }
  31. .ngx-datatable [hidden] {
  32. display: none !important; }
  33. .ngx-datatable *,
  34. .ngx-datatable *:before,
  35. .ngx-datatable *:after {
  36. -moz-box-sizing: border-box;
  37. -webkit-box-sizing: border-box;
  38. box-sizing: border-box; }
  39. .ngx-datatable.scroll-vertical .datatable-body {
  40. overflow-y: auto; }
  41. .ngx-datatable.scroll-vertical.virtualized .datatable-body .datatable-row-wrapper {
  42. position: absolute; }
  43. .ngx-datatable.scroll-horz .datatable-body {
  44. overflow-x: auto;
  45. -webkit-overflow-scrolling: touch; }
  46. .ngx-datatable.fixed-header .datatable-header .datatable-header-inner {
  47. white-space: nowrap; }
  48. .ngx-datatable.fixed-header .datatable-header .datatable-header-inner .datatable-header-cell {
  49. white-space: nowrap;
  50. overflow: hidden;
  51. text-overflow: ellipsis; }
  52. .ngx-datatable.fixed-row .datatable-scroll {
  53. white-space: nowrap; }
  54. .ngx-datatable.fixed-row .datatable-scroll .datatable-body-row {
  55. white-space: nowrap; }
  56. .ngx-datatable.fixed-row .datatable-scroll .datatable-body-row .datatable-body-cell {
  57. overflow: hidden;
  58. white-space: nowrap;
  59. text-overflow: ellipsis; }
  60. .ngx-datatable.fixed-row .datatable-scroll .datatable-body-row .datatable-body-group-cell {
  61. overflow: hidden;
  62. white-space: nowrap;
  63. text-overflow: ellipsis; }
  64. .ngx-datatable .datatable-body-row,
  65. .ngx-datatable .datatable-row-center,
  66. .ngx-datatable .datatable-header-inner {
  67. display: -webkit-box;
  68. display: -moz-box;
  69. display: -ms-flexbox;
  70. display: -webkit-flex;
  71. display: flex;
  72. flex-direction: row;
  73. -webkit-flex-flow: row;
  74. -moz-flex-flow: row;
  75. -ms-flex-flow: row;
  76. -o-flex-flow: row;
  77. flex-flow: row; }
  78. .ngx-datatable .datatable-body-cell,
  79. .ngx-datatable .datatable-header-cell {
  80. overflow-x: hidden;
  81. vertical-align: top;
  82. display: inline-block;
  83. line-height: 1.625; }
  84. .ngx-datatable .datatable-body-cell:focus,
  85. .ngx-datatable .datatable-header-cell:focus {
  86. outline: none; }
  87. .ngx-datatable .datatable-row-left,
  88. .ngx-datatable .datatable-row-right {
  89. z-index: 9; }
  90. .ngx-datatable .datatable-row-left,
  91. .ngx-datatable .datatable-row-center,
  92. .ngx-datatable .datatable-row-group,
  93. .ngx-datatable .datatable-row-right {
  94. position: relative; }
  95. .ngx-datatable .datatable-header {
  96. display: block;
  97. overflow: hidden; }
  98. .ngx-datatable .datatable-header .datatable-header-inner {
  99. align-items: stretch;
  100. -webkit-align-items: stretch; }
  101. .ngx-datatable .datatable-header .datatable-header-cell {
  102. position: relative;
  103. display: inline-block; }
  104. .ngx-datatable .datatable-header .datatable-header-cell.sortable .datatable-header-cell-wrapper {
  105. cursor: pointer; }
  106. .ngx-datatable .datatable-header .datatable-header-cell.longpress .datatable-header-cell-wrapper {
  107. cursor: move; }
  108. .ngx-datatable .datatable-header .datatable-header-cell .sort-btn {
  109. line-height: 100%;
  110. vertical-align: middle;
  111. display: inline-block;
  112. cursor: pointer; }
  113. .ngx-datatable .datatable-header .datatable-header-cell .resize-handle,
  114. .ngx-datatable .datatable-header .datatable-header-cell .resize-handle--not-resizable {
  115. display: inline-block;
  116. position: absolute;
  117. right: 0;
  118. top: 0;
  119. bottom: 0;
  120. width: 5px;
  121. padding: 0 4px;
  122. visibility: hidden; }
  123. .ngx-datatable .datatable-header .datatable-header-cell .resize-handle {
  124. cursor: ew-resize; }
  125. .ngx-datatable .datatable-header .datatable-header-cell.resizeable:hover .resize-handle {
  126. visibility: visible; }
  127. .ngx-datatable .datatable-header .datatable-header-cell:hover .resize-handle--not-resizable {
  128. visibility: visible; }
  129. .ngx-datatable .datatable-header .datatable-header-cell .targetMarker {
  130. position: absolute;
  131. top: 0;
  132. bottom: 0; }
  133. .ngx-datatable .datatable-header .datatable-header-cell .targetMarker.dragFromLeft {
  134. right: 0; }
  135. .ngx-datatable .datatable-header .datatable-header-cell .targetMarker.dragFromRight {
  136. left: 0; }
  137. .ngx-datatable .datatable-header .datatable-header-cell .datatable-header-cell-template-wrap {
  138. height: inherit; }
  139. .ngx-datatable .datatable-body {
  140. position: relative;
  141. z-index: 10;
  142. display: block; }
  143. .ngx-datatable .datatable-body .datatable-scroll {
  144. display: inline-block; }
  145. .ngx-datatable .datatable-body .datatable-row-detail {
  146. overflow-y: hidden; }
  147. .ngx-datatable .datatable-body .datatable-row-wrapper {
  148. display: -webkit-box;
  149. display: -moz-box;
  150. display: -ms-flexbox;
  151. display: -webkit-flex;
  152. display: flex;
  153. -webkit-box-orient: vertical;
  154. -webkit-box-direction: normal;
  155. -webkit-flex-direction: column;
  156. -moz-box-orient: vertical;
  157. -moz-box-direction: normal;
  158. -ms-flex-direction: column;
  159. flex-direction: column; }
  160. .ngx-datatable .datatable-body .datatable-body-row {
  161. outline: none; }
  162. .ngx-datatable .datatable-body .datatable-body-row > div {
  163. display: -webkit-box;
  164. display: -moz-box;
  165. display: -ms-flexbox;
  166. display: -webkit-flex;
  167. display: flex; }
  168. .ngx-datatable .datatable-footer {
  169. display: block;
  170. width: 100%;
  171. overflow: auto; }
  172. .ngx-datatable .datatable-footer .datatable-footer-inner {
  173. display: flex;
  174. align-items: center;
  175. width: 100%; }
  176. .ngx-datatable .datatable-footer .selected-count .page-count {
  177. flex: 1 1 40%; }
  178. .ngx-datatable .datatable-footer .selected-count .datatable-pager {
  179. flex: 1 1 60%; }
  180. .ngx-datatable .datatable-footer .page-count {
  181. flex: 1 1 20%; }
  182. .ngx-datatable .datatable-footer .datatable-pager {
  183. flex: 1 1 80%;
  184. text-align: right; }
  185. .ngx-datatable .datatable-footer .datatable-pager .pager,
  186. .ngx-datatable .datatable-footer .datatable-pager .pager li {
  187. padding: 0;
  188. margin: 0;
  189. display: inline-block;
  190. list-style: none; }
  191. .ngx-datatable .datatable-footer .datatable-pager .pager li,
  192. .ngx-datatable .datatable-footer .datatable-pager .pager li a {
  193. outline: none; }
  194. .ngx-datatable .datatable-footer .datatable-pager .pager li a {
  195. cursor: pointer;
  196. display: inline-block; }
  197. .ngx-datatable .datatable-footer .datatable-pager .pager li.disabled a {
  198. cursor: not-allowed; }