tablesort-indicator.css

Same filename in other branches
  1. 9 core/themes/seven/css/components/tablesort-indicator.css
  2. 9 core/themes/claro/css/components/tablesort-indicator.css
  3. 9 core/themes/bartik/css/components/tablesort-indicator.css
  4. 8.9.x core/themes/seven/css/components/tablesort-indicator.css
  5. 8.9.x core/themes/claro/css/components/tablesort-indicator.css
  6. 8.9.x core/themes/bartik/css/components/tablesort-indicator.css
  7. 11.x core/themes/claro/css/components/tablesort-indicator.css

Tablesort indicator styles.

File

core/themes/claro/css/components/tablesort-indicator.css

View source
  1. /*
  2. * DO NOT EDIT THIS FILE.
  3. * See the following change record for more information,
  4. * https://www.drupal.org/node/3084859
  5. * @preserve
  6. */
  7. /**
  8. * @file
  9. * Tablesort indicator styles.
  10. */
  11. .tablesort {
  12. position: absolute;
  13. top: 50%;
  14. inset-inline-end: 1rem;
  15. width: 0.875rem;
  16. height: var(--space-m);
  17. margin-block-start: -0.5rem;
  18. opacity: 0.5;
  19. background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8'%3e%3cpath d='M1.75.25v1.5h10.5V.25zm0 3v1.5h7.5v-1.5zm0 3v1.5h4.5v-1.5z' fill='%23000f33'/%3e%3c/svg%3e");
  20. background-repeat: no-repeat;
  21. background-position: 0 50%;
  22. background-size: auto;
  23. }
  24. [dir="rtl"] .tablesort {
  25. /* Horizontally flip the element. */
  26. transform: scaleX(-1);
  27. }
  28. @media (forced-colors: active) {
  29. .tablesort {
  30. background: linktext;
  31. mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8'%3e%3cpath d='M1.75.25v1.5h10.5V.25zm0 3v1.5h7.5v-1.5zm0 3v1.5h4.5v-1.5z' fill='%23000f33'/%3e%3c/svg%3e");
  32. mask-repeat: no-repeat;
  33. mask-position: 0 50%;
  34. }
  35. }
  36. .tablesort--asc {
  37. opacity: 1;
  38. background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 10 12'%3e%3cpath d='M5 .44L.719 4.718 1.78 5.78 4.25 3.313v7.937h1.5V3.312l2.469 2.47L9.28 4.718 5 .439z' fill='%23003ecc'/%3e%3c/svg%3e");
  39. }
  40. @media (forced-colors: active) {
  41. .tablesort--asc {
  42. background: linktext;
  43. mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 10 12'%3e%3cpath d='M5 .44L.719 4.718 1.78 5.78 4.25 3.313v7.937h1.5V3.312l2.469 2.47L9.28 4.718 5 .439z' fill='%23003ecc'/%3e%3c/svg%3e");
  44. }
  45. }
  46. .tablesort--desc {
  47. opacity: 1;
  48. background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 10 12'%3e%3cpath d='M4.25.75v7.938l-2.469-2.47L.72 7.282 5 11.561l4.281-4.28L8.22 6.22 5.75 8.687V.75h-1.5z' fill='%23003ecc'/%3e%3c/svg%3e");
  49. }
  50. @media (forced-colors: active) {
  51. .tablesort--desc {
  52. background: linktext;
  53. mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='14' height='16' viewBox='0 0 10 12'%3e%3cpath d='M4.25.75v7.938l-2.469-2.47L.72 7.282 5 11.561l4.281-4.28L8.22 6.22 5.75 8.687V.75h-1.5z' fill='%23003ecc'/%3e%3c/svg%3e");
  54. }
  55. }

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