Boa noite, Davi! Como vai?
Vou responder suas perguntas por partes.
Como exibir um imagem parcial em telas menores?
Para isso vc teria que trabalhar com a imagem como sendo o fundo de um elemento. Primeiro, definir uma div
que receberia a imagem como fundo:
<div class="team-logo"></div>
Em seguida o CSS:
.team-logo {
background: url(../imagens/requite.jpeg) no-repeat;
background-position: center;
height: 50px;
width: 100%;
margin: 1em 0;
}
@media(min-width: 650px) {
.team-logo {
position: absolute;
left: 0;
top: 0;
width: 40%;
height: 200px;
background-size: contain
}
}
Caso a API esteja fora do ar, como faço pra pegar o erro e dar o feedback ao usuário?
Uma forma possível de resolver isso seria utilizar o catch()
da Promise
retornada pela Fetch API:
fetch(`http://localhost:8080/usuarios`, requestInfo)
.then(response => {
// manipula a resposta ...
})
.catch(erro => {
// manipula o erro enviando uma mensagem para o usuário ...
});
Pegou a ideia? Qualquer coisa é só falar!
Grande abraço e bons estudos, meu aluno!