_bulk_actions.scss 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. .bulk-actions-filter-checkbox {
  2. .table-headers & {
  3. > div {
  4. display: flex;
  5. align-items: center;
  6. }
  7. .c-dropdown__button {
  8. padding-inline-start: 0.3rem;
  9. }
  10. .bulk-actions-choices,
  11. .bulk-actions-choices > ul {
  12. display: flex;
  13. align-items: center;
  14. }
  15. .bulk-actions-choices li {
  16. margin: 0 0.5em;
  17. }
  18. }
  19. }
  20. .listing:not(.full-width) {
  21. thead th.bulk-actions-filter-checkbox,
  22. td.bulk-action-checkbox-cell {
  23. padding: 0;
  24. width: 50px;
  25. text-align: center;
  26. input[type='checkbox'] {
  27. margin: 0;
  28. }
  29. + th,
  30. + td {
  31. padding-inline-start: 0;
  32. }
  33. }
  34. }
  35. .bulk-actions-choices {
  36. &.footer {
  37. @include transition(transform 0.1s ease 0.1s);
  38. &.hidden {
  39. transform: translateY(200px);
  40. visibility: hidden;
  41. }
  42. .button {
  43. font-weight: 600;
  44. }
  45. .bulk-actions-more {
  46. .button {
  47. border: 0;
  48. }
  49. .button:not(:hover) {
  50. color: theme('colors.surface-button-default');
  51. }
  52. .c-dropdown__menu {
  53. bottom: 50px;
  54. flex-direction: column;
  55. }
  56. }
  57. .bulk-actions-more.is-open {
  58. .c-dropdown__menu.u-toggle {
  59. display: flex;
  60. }
  61. }
  62. }
  63. .footer__container {
  64. display: flex;
  65. justify-content: space-around;
  66. width: 100%;
  67. align-items: center;
  68. padding: 1.25em;
  69. border-radius: 4px 4px 0 0;
  70. margin-inline-start: 30px;
  71. input[type='checkbox'] {
  72. margin-inline-end: 1.25em;
  73. }
  74. .bulk-actions-buttons {
  75. border-inline-start: 1px solid theme('colors.icon-secondary');
  76. padding-inline-start: 1.5em;
  77. .bulk-action-btn {
  78. max-width: 160px;
  79. overflow-x: hidden;
  80. text-overflow: ellipsis;
  81. }
  82. }
  83. .num-objects {
  84. margin: 0 5px;
  85. }
  86. .num-objects-in-listing {
  87. color: theme('colors.text-link-default');
  88. background-color: transparent;
  89. border: 0;
  90. font-family: $font-sans;
  91. padding: 0;
  92. }
  93. .button:not(:hover) {
  94. background-color: theme('colors.surface-page');
  95. }
  96. }
  97. }