tabledrag.module.css

Same filename in this branch
  1. 8.9.x core/themes/stable/css/system/components/tabledrag.module.css
Same filename in other branches
  1. 9 core/themes/stable9/css/system/components/tabledrag.module.css
  2. 9 core/themes/stable/css/system/components/tabledrag.module.css
  3. 9 core/modules/system/css/components/tabledrag.module.css
  4. 10 core/themes/stable9/css/system/components/tabledrag.module.css
  5. 10 core/modules/system/css/components/tabledrag.module.css
  6. 11.x core/themes/stable9/css/system/components/tabledrag.module.css
  7. 11.x core/modules/system/css/components/tabledrag.module.css
  8. 10 core/misc/components/tabledrag.module.css
  9. 10 core/themes/stable9/css/core/components/tabledrag.module.css
  10. 11.x core/misc/components/tabledrag.module.css
  11. 11.x core/themes/stable9/css/core/components/tabledrag.module.css

Table drag behavior.

See also

tabledrag.js

File

core/modules/system/css/components/tabledrag.module.css

View source
  1. /**
  2. * @file
  3. * Table drag behavior.
  4. *
  5. * @see tabledrag.js
  6. */
  7. body.drag {
  8. cursor: move;
  9. }
  10. tr.region-title {
  11. font-weight: bold;
  12. }
  13. tr.region-message {
  14. color: #999;
  15. }
  16. tr.region-populated {
  17. display: none;
  18. }
  19. tr.add-new .tabledrag-changed {
  20. display: none;
  21. }
  22. .draggable a.tabledrag-handle {
  23. float: left; /* LTR */
  24. overflow: hidden;
  25. height: 1.7em;
  26. margin-left: -1em; /* LTR */
  27. cursor: move;
  28. text-decoration: none;
  29. }
  30. [dir="rtl"] .draggable a.tabledrag-handle {
  31. float: right;
  32. margin-right: -1em;
  33. margin-left: 0;
  34. }
  35. a.tabledrag-handle:hover {
  36. text-decoration: none;
  37. }
  38. a.tabledrag-handle .handle {
  39. width: 14px;
  40. height: 14px;
  41. margin: -0.4em 0.5em 0;
  42. padding: 0.42em 0.5em;
  43. background: url(../../../../misc/icons/787878/move.svg) no-repeat 6px 7px;
  44. }
  45. a.tabledrag-handle:hover .handle,
  46. a.tabledrag-handle:focus .handle {
  47. background-image: url(../../../../misc/icons/000000/move.svg);
  48. }
  49. .touchevents .draggable td {
  50. padding: 0 10px;
  51. }
  52. .touchevents .draggable .menu-item__link {
  53. display: inline-block;
  54. padding: 10px 0;
  55. }
  56. .touchevents a.tabledrag-handle {
  57. width: 40px;
  58. height: 44px;
  59. }
  60. .touchevents a.tabledrag-handle .handle {
  61. height: 21px;
  62. background-position: 40% 19px; /* LTR */
  63. }
  64. [dir="rtl"] .touch a.tabledrag-handle .handle {
  65. background-position: right 40% top 19px;
  66. }
  67. .touchevents .draggable.drag a.tabledrag-handle .handle {
  68. background-position: 50% -32px;
  69. }
  70. .tabledrag-toggle-weight-wrapper {
  71. text-align: right; /* LTR */
  72. }
  73. [dir="rtl"] .tabledrag-toggle-weight-wrapper {
  74. text-align: left;
  75. }
  76. .indentation {
  77. float: left; /* LTR */
  78. width: 20px;
  79. height: 1.7em;
  80. margin: -0.4em 0.2em -0.4em -0.4em; /* LTR */
  81. padding: 0.42em 0 0.42em 0.6em; /* LTR */
  82. }
  83. [dir="rtl"] .indentation {
  84. float: right;
  85. margin: -0.4em -0.4em -0.4em 0.2em;
  86. padding: 0.42em 0.6em 0.42em 0;
  87. }

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.