home.component.html

<div class="container">
  <div class="row">
    <div class="col-sm-6 mb-2">
      <img class="img-fluid d-none d-sm-block"
        src="assets/img/home.jpg"
        alt="Imagem de um gato para as boas vindas"
      />
    </div>
    <div class="col-sm-6 mb-2">
      <router-outlet></router-outlet>
    </div>
  </div>
</div>

Meu formulário de login não fica no mesmo formato... login.component.html

<h4 class="text-center">Login</h4>
<form class="form mt-4">
  <div class="form-group">
    <input class="form-control" placeholder="Nome do usuário" />
  </div>
  <div class="form-group">
    <input type="password" class="form-control" placeholder="Senha" />
  </div>
  <button type="submit" class="btn btn-primary btn-block">Login</button>
</form>

já conferi as classes, porem não fica com o espaçamento certo.

por exemplo... o button fica com o formato azul, porem não ocupa todo o espaço com o comportamento do block