мерцание поля ввода React MDbootstrap

Я пытался создать форму входа. Но при фокусировке на поле ввода мерцает вся страница. Ниже приведен код рендеринга,

render() {
    return (
        <div>
            <div className="row">
                <div className="col-md-8 login-image"/>
                <div className="col-md-4">
                    <div className="login-form">
                        <h2 className="mb-5">Form login</h2>
                        <form>
                            <p className="h5 text-center mb-4">Sign in</p>
                            <Input label="Email"
                                   icon="envelope-open" group type="email"
                                   validate error="wrong"
                                   success="right"/>
                            <Input label="Password" icon="lock" group
                                    type="password" validate/>
                            <div className="text-center">
                                <Button>Login</Button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    );
};

CSS-код

 .login-image {
background: url("../../resources/coming-soon2.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;

}

.login-form {
min-height: 100%;
min-height: 100vh;
padding: 50px;

}

Я получаю приведенный ниже вывод, как и ожидалось, но при фокусе thetextfield вся веб-страница начинает мерцать. Это происходит только в chrome логин