fix: Revert #17684 (#18097)

* fix: Revert #17684

* update snapshot

* gt di

components/input/__tests__/__snapshots__/demo.test.js.snap

@@ -983,6 +983,7 @@ exports[`renders ./components/input/demo/password-input.md correctly 1`] = `
 `;
 
 exports[`renders ./components/input/demo/presuffix.md correctly 1`] = `
+<div>
   <span
     class="ant-input-affix-wrapper"
   >
@@ -1044,6 +1045,28 @@ exports[`renders ./components/input/demo/presuffix.md correctly 1`] = `
       </i>
     </span>
   </span>
+  <br />
+  <br />
+  <span
+    class="ant-input-affix-wrapper"
+  >
+    <span
+      class="ant-input-prefix"
+    >
+      ￥
+    </span>
+    <input
+      class="ant-input"
+      type="text"
+      value=""
+    />
+    <span
+      class="ant-input-suffix"
+    >
+      RMB
+    </span>
+  </span>
+</div>
 `;
 
 exports[`renders ./components/input/demo/search-input.md correctly 1`] = `

components/input/demo/presuffix.md

@@ -17,6 +17,7 @@ Add prefix or suffix icons inside input.
 import { Input, Tooltip, Icon } from 'antd';
 
 ReactDOM.render(
+  <div>
     <Input
       placeholder="Enter your username"
       prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
@@ -25,7 +26,13 @@ ReactDOM.render(
           <Icon type="info-circle" style={{ color: 'rgba(0,0,0,.45)' }} />
         </Tooltip>
       }
-  />,
+    />
+
+    <br />
+    <br />
+
+    <Input prefix="￥" suffix="RMB" />
+  </div>,
   mountNode,
 );
 ```

components/input/style/mixin.less

@@ -369,25 +369,23 @@
     text-align: inherit;
   }
 
+  // Should not break align of icon & text
+  // https://github.com/ant-design/ant-design/issues/18087
+  // https://github.com/ant-design/ant-design/issues/17414
+  // https://github.com/ant-design/ant-design/pull/17684
+  // https://codesandbox.io/embed/pensive-paper-di2wk
+  // https://codesandbox.io/embed/nifty-benz-gb7ml
   .@{inputClass}-prefix,
   .@{inputClass}-suffix {
     position: absolute;
-    top: 0;
+    top: 50%;
     z-index: 2;
     color: @input-color;
     line-height: 0;
-    height: 100%;
-    box-sizing: border-box;
-    padding: @input-padding-vertical-base + @border-width-base 0;
+    transform: translateY(-50%);
     :not(.anticon) {
       line-height: @line-height-base;
     }
-    .anticon {
-      position: relative;
-      vertical-align: top;
-      top: 50%;
-      transform: translateY(-50%);
-    }
   }
 
   .@{inputClass}-prefix {