_forms.scss 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. input[type="text"],
  2. input[type="email"],
  3. input[type="url"],
  4. input[type="password"],
  5. input[type="search"],
  6. input[type="number"],
  7. input[type="tel"],
  8. input[type="range"],
  9. input[type="date"],
  10. input[type="month"],
  11. input[type="week"],
  12. input[type="time"],
  13. input[type="datetime"],
  14. input[type="datetime-local"],
  15. input[type="color"],
  16. textarea {
  17. color: #{map-deep-get($config-elements, "form", "color", "text")};
  18. border: #{map-deep-get($config-elements, "form", "border", "width")} solid #{map-deep-get($config-elements, "form", "color", "border")};
  19. border-radius: #{map-deep-get($config-elements, "form", "border", "radius")};
  20. padding: #{map-deep-get($config-elements, "form", "padding")};
  21. &:focus {
  22. color: #{map-deep-get($config-elements, "form", "color", "text")};
  23. border-color: #{map-deep-get($config-elements, "form", "color", "border-focus")};
  24. }
  25. }
  26. select {
  27. border: #{map-deep-get($config-elements, "form", "border", "width")} solid #{map-deep-get($config-elements, "form", "color", "border")};
  28. }
  29. textarea {
  30. width: 100%;
  31. }
  32. // Vertically align checkbox + label relationship
  33. input[type=checkbox] + label {
  34. display: inline;
  35. margin-left: 0.5em;
  36. margin-right: 2em;
  37. line-height: 1em;
  38. }