form--select.css

Same filename in other branches
  1. 9 core/themes/claro/css/components/form--select.css
  2. 10 core/themes/claro/css/components/form--select.css
  3. 11.x core/themes/claro/css/components/form--select.css

Select input elements.

File

core/themes/claro/css/components/form--select.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/2815083
  5. * @preserve
  6. */
  7. /**
  8. * @file
  9. * Select input elements.
  10. */
  11. .form-element--type-select {
  12. padding-right: calc(2rem - 1px);
  13. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath fill='none' stroke-width='1.5' d='M1 1L7 7L13 1' stroke='%23545560'/%3E%3C/svg%3E%0A");
  14. background-repeat: no-repeat;
  15. background-position: 100% 50%;
  16. background-size: 2.75rem 0.5625rem; /* w: 14px + (2 * 15px), h: 9px */
  17. }
  18. [dir="rtl"] .form-element--type-select {
  19. padding-right: calc(1rem - 1px);
  20. padding-left: calc(2rem - 1px);
  21. background-position: 0 50%;
  22. }
  23. .no-touchevents .form-element--type-select.form-element--extrasmall,
  24. .no-touchevents .form-element--type-select[name$="][_weight]"] {
  25. padding-right: calc(1.5rem - 1px);
  26. background-size: 1.75rem 0.4375rem; /* w: 14px + (2 * 7px), h: 7px */
  27. }
  28. [dir="rtl"].no-touchevents .form-element--type-select.form-element--extrasmall,
  29. [dir="rtl"].no-touchevents .form-element--type-select[name$="][_weight]"] {
  30. padding-right: calc(0.5rem - 1px);
  31. padding-left: calc(1.5rem - 1px);
  32. }
  33. .form-element--type-select::-ms-expand {
  34. display: none;
  35. }
  36. /**
  37. * Select states.
  38. */
  39. .form-element--type-select:focus {
  40. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath fill='none' stroke-width='1.5' d='M1 1L7 7L13 1' stroke='%23004adc'/%3E%3C/svg%3E%0A");
  41. }
  42. .form-element--type-select[disabled] {
  43. background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath fill='none' stroke-width='1.5' d='M1 1L7 7L13 1' stroke='%238e929c'/%3E%3C/svg%3E%0A");
  44. }

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