textinput.scss 949 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. .nut-textinput {
  2. display: flex;
  3. align-items: center;
  4. position: relative;
  5. input {
  6. flex: 1;
  7. height: 40px;
  8. appearance: none;
  9. font-size: 14px;
  10. box-sizing: border-box;
  11. border-radius: 4px;
  12. border: 1px solid #DDDFE6;
  13. background-color: '#FFFFFF';
  14. padding: 0 30px 0 10px;
  15. &::-webkit-input-placeholder {
  16. color: #C1C4CB;
  17. font-style: normal;
  18. }
  19. }
  20. .nut-textinput-clear {
  21. position: absolute;
  22. right: 5px;
  23. top: 50%;
  24. transform: translateY(-50%);
  25. height: 20px;
  26. width: 20px;
  27. svg {
  28. vertical-align: top;
  29. fill: #999999;
  30. }
  31. }
  32. }
  33. .nut-textinput-disabled {
  34. input {
  35. background-color: #F5F7FA;
  36. border-color: #E5E7ED;
  37. color: #999999;
  38. &::-webkit-input-placeholder {
  39. color: #D1D3D9;
  40. }
  41. }
  42. }