Solucionado
Nesta aula, o instrutor pediu para adicionar padding: 1empara o ícone, mas isto deixaria o ícone muito grande e nos arquivos do projeto disponibilizado não há o paddingaplicado e nem na solução do instrutor desta atividade para saber como lidar com isto.
Tiago, boa tarde!
Na verdade o instrutor não se referiu ao uso de padding, mas sim de definir os tamanhos do elemento. Veja:
Então adicione esses ícones aos campos, deixando-os com 2em de largura e altura
Ele faz isso no:
.com-icone::after {
content: '';
width: 2em; <----Adicionando largura
height: 2em;<-----Adicionando a altura
background-color: #8C1D3D;
background-size: 50% 50%; /* para a imagem ter 1em x 1em */
background-position: center;
background-repeat: no-repeat;
}E aqui:
e um espaçamento de mais 1em em todos os lados.
ele aplica nessa linha
.com-icone + input {
width: calc(100% - 2em); <---
}Espero ter ajudado e bons estudos!