index.less 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. .basic-number--left.el-input-number {
  2. height: 32px;
  3. .el-input__inner {
  4. text-align: left;
  5. }
  6. }
  7. .el-input-number {
  8. .el-input {
  9. .el-input__wrapper {
  10. padding: 1px 12px;
  11. }
  12. }
  13. &.basic-number--left {
  14. height: 32px;
  15. .el-input__inner {
  16. text-align: left;
  17. }
  18. }
  19. &.basic-number--unit {
  20. position: relative;
  21. .el-input__inner {
  22. text-align: left;
  23. padding-right: 24px;
  24. }
  25. &::after {
  26. content: attr(data-unit);
  27. position: absolute;
  28. right: 4px;
  29. top: 2px;
  30. height: @formItemLineHeight;
  31. color: @info;
  32. }
  33. }
  34. &.basic-number-standard {
  35. .el-input-number__decrease {
  36. left: auto;
  37. right: 32px;
  38. // 按钮30px+右边框1px+左边竖线1px
  39. background: inherit;
  40. border: none;
  41. }
  42. .el-input-number__increase {
  43. background: inherit;
  44. border: none;
  45. &::before {
  46. content: '';
  47. position: absolute;
  48. left: 0;
  49. top: 8px;
  50. bottom: 8px;
  51. width: 1px;
  52. background: var(--el-border-color);
  53. }
  54. }
  55. .el-input__inner {
  56. // 61px = 右侧两个按钮2*30+中间竖线1px,15px为默认的左边间距
  57. }
  58. &.el-input-number--large {
  59. .el-input-number__decrease {
  60. right: 40px;
  61. // 按钮38px+右边框1px+左边竖线1px
  62. }
  63. .el-input__inner {
  64. // 77px = 右侧两个按钮2*38+中间竖线1px,15px为默认的左右边间距
  65. }
  66. }
  67. }
  68. &.basic-number--no-controls {
  69. .el-input__inner {
  70. // no-controls 的padding权重需要比 basic-number-standard 的高
  71. }
  72. }
  73. }