tablesort-indicator.pcss.css

Same filename in other branches
  1. 9 core/themes/claro/css/components/tablesort-indicator.pcss.css
  2. 8.9.x core/themes/claro/css/components/tablesort-indicator.pcss.css
  3. 11.x core/themes/claro/css/components/tablesort-indicator.pcss.css

Tablesort indicator styles.

File

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

View source
  1. /**
  2. * @file
  3. * Tablesort indicator styles.
  4. */
  5. .tablesort {
  6. position: absolute;
  7. top: 50%;
  8. inset-inline-end: 1rem;
  9. width: 14px;
  10. height: var(--space-m);
  11. margin-block-start: -8px;
  12. opacity: 0.5;
  13. background-image: url(../../images/icons/000f33/sort--inactive.svg);
  14. background-repeat: no-repeat;
  15. background-position: 0 50%;
  16. background-size: auto;
  17. [dir="rtl"]
  18. @media (forced-colors: active) {
  19. background: linktext;
  20. mask-image: url(../../images/icons/000f33/sort--inactive.svg);
  21. mask-repeat: no-repeat;
  22. mask-position: 0 50%;
  23. }
  24. }
  25. .tablesort--asc {
  26. opacity: 1;
  27. background-image: url(../../images/icons/003ecc/sort--asc.svg);
  28. @media (forced-colors: active) {
  29. background: linktext;
  30. mask-image: url(../../images/icons/003ecc/sort--asc.svg);
  31. }
  32. }
  33. .tablesort--desc {
  34. opacity: 1;
  35. background-image: url(../../images/icons/003ecc/sort--desc.svg);
  36. @media (forced-colors: active) {
  37. background: linktext;
  38. mask-image: url(../../images/icons/003ecc/sort--desc.svg);
  39. }
  40. }

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