No Description
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.

_table.scss 1.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. //
  2. // Table
  3. //
  4. // General styles
  5. .table {
  6. thead th {
  7. padding-top: $table-head-spacer-y;
  8. padding-bottom: $table-head-spacer-y;
  9. font-size: $table-head-font-size;
  10. text-transform: $table-head-text-transform;
  11. letter-spacing: $table-head-letter-spacing;
  12. border-bottom: $table-border-width solid $table-border-color;
  13. }
  14. th {
  15. font-weight: $table-head-font-weight;
  16. }
  17. td {
  18. .progress {
  19. height: 3px;
  20. width: 120px;
  21. margin: 0;
  22. }
  23. }
  24. td,
  25. th {
  26. font-size: $table-body-font-size;
  27. white-space: nowrap;
  28. }
  29. // Vetical align table content
  30. &.align-items-center {
  31. td,
  32. th {
  33. vertical-align: middle;
  34. }
  35. }
  36. // Styles for dark table
  37. .thead-dark {
  38. th {
  39. background-color: $table-dark-head-bg;
  40. color: $table-dark-head-color;
  41. }
  42. }
  43. // Styles for light table
  44. .thead-light {
  45. th {
  46. background-color: $table-head-bg;
  47. color: $table-head-color;
  48. }
  49. }
  50. }
  51. // Add transition for hover state
  52. .table-hover {
  53. tr {
  54. @include transition($transition-base);
  55. }
  56. }
  57. // Flush tables
  58. .table-flush {
  59. td,
  60. th {
  61. border-left: 0;
  62. border-right: 0;
  63. }
  64. tbody {
  65. tr {
  66. &:first-child {
  67. td,
  68. th {
  69. border-top: 0;
  70. }
  71. }
  72. &:last-child {
  73. td,
  74. th {
  75. border-bottom: 0;
  76. }
  77. }
  78. }
  79. }
  80. }
  81. // Tables inside cards
  82. .card {
  83. .table {
  84. margin-bottom: 0;
  85. td,
  86. th {
  87. padding-left: $card-spacer-x;
  88. padding-right: $card-spacer-x;
  89. }
  90. }
  91. }