The antd form looks different on different computers

[backloz]

There is the next test code:

class MyApp extends React.Component {
  render(){
    const { getFieldDecorator } = this.props.form;
    return (
      <Form className="login-form">
        <Form.Item>
          {getFieldDecorator('username', {
            trigger: 'onBlur',
            validateTrigger: 'onBlur',
            valuePropName: 'defaultValue',
            initialValue: 123,
            rules: [
                    { required: true, message: 'Please input your username!' },
                    { pattern: /^\s*[0-9]+\s*$/, message: 'wrong input!!!' }
                    ]
          })(
            <Input
              prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
              placeholder="Username"
            />,
          )}
        </Form.Item>
        <Form.Item>
          {getFieldDecorator('password', {
            rules: [{ required: true, message: 'Please input your Password!' }],
          })(
            <Input
              prefix={<Icon type="lock" style={{ color: 'rgba(0,0,0,.25)' }} />}
              type="password"
              placeholder="Password"
            />,
          )}
        </Form.Item>
      </Form>
    );
  }
}

const App = Form.create()(MyApp);

export default App;

This code creates a form and several input fields. In this code, I checked how the validation works. This code works great and creates an interface as on the picture:

When I run this code on another computer, I get the following picture:

, in which the icons are extended outside the input field and when the field is validated, the field is not colored red.

Please tell me how to make the form look like in the first case.