form--select.pcss.css

Same filename in this branch
  1. main core/themes/claro/css/components/form--select.pcss.css
  2. main core/themes/admin/css/components/form--select.pcss.css
Same filename and directory in other branches
  1. 10 core/themes/claro/css/components/form--select.pcss.css
  2. 11.x core/themes/claro/css/components/form--select.pcss.css
  3. 9 core/themes/claro/css/components/form--select.pcss.css
  4. 8.9.x core/themes/claro/css/components/form--select.pcss.css
  5. 11.x core/themes/admin/css/components/form--select.pcss.css
  6. 11.x core/themes/default_admin/css/components/form--select.pcss.css

Select input elements.

File

core/themes/default_admin/css/components/form--select.pcss.css

View source
  1. /**
  2. * @file
  3. * Select input elements.
  4. */
  5. .form-element--type-select {
  6. padding-inline-end: calc(var(--gin-spacing-xs) + var(--gin-spacing-xl) - 1px);
  7. background-image: url(../../images/icons/545560/chevron-down.svg);
  8. background-repeat: no-repeat;
  9. background-position: 100% 50%;
  10. background-size: 2.75rem 0.5625rem; /* w: 14px + (2 * 15px), h: 9px */
  11. /**
  12. * Select states.
  13. */
  14. &:focus {
  15. background-image: url(../../images/icons/003ecc/chevron-down.svg);
  16. }
  17. &[disabled] {
  18. background-image: url(../../images/icons/8e929c/chevron-down.svg);
  19. }
  20. &:dir(rtl) {
  21. background-position: 0 50%;
  22. }
  23. .gin--dark-mode
  24. .no-touchevents
  25. }
  26. }
  27. @media (forced-colors: active) {
  28. .form-element--type-select,
  29. .form-element--type-select:focus,
  30. .form-element--type-select[disabled] {
  31. padding-inline-end: var(--input-padding-horizontal);
  32. background-image: none;
  33. appearance: revert; /* Revert appearance value for modern browsers. */
  34. }
  35. }
  36. .form-element--type-select--small {
  37. min-height: 2.25rem;
  38. background-position: 100% 52%;
  39. font-size: var(--gin-font-size-xs);
  40. line-height: 1.4;
  41. padding-block: 0.474rem;
  42. /* 0.79rem * 1.2 / 2 */
  43. &:dir(rtl) {
  44. background-position: 0% 52%;
  45. }
  46. }

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