[Dúvida] HTML e CSS: Atividade 9 | HTML e CSS: trabalhando com responsividade e publicação de projetos

Erro no VScode: como alterar no Github e no Vercel?

Eu tô com uma dificuldade, no meu código decidi colocar uma cor principal de fonte não totalmente branco (para não ficar aquela coisa de doer os olhos), escolhi uma cor ótima. Subi meu código para o Github e depois para o Vercel, pelo pc ficou perfeito as cores, mas quando abri pelo telefone ficou escuro demais a cor de fonte principal.

Afinal, para mudar isso eu terei que alterar no meu código pelo VScode e depois mudar no Github e depois subir o arquivo todo de novo para o Vercel? Não existe uma forma mais prática?

Imagem 1 e 2 pelo computador, imagem 3 pelo telefone: Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Oi, Anna! Como vai?

Pra resolver isso você precisa alterar no seu código local (VSCode), subir pro GitHub e a Vercel atualiza automaticamente (se sua conta Vercel estiver integrada corretamente ao seu GitHub).

Provavelmente a diferença de cores está acontecendo por conta dos media queries no CSS. Alguma cor mais escura deve estar sendo aplicada nos media queries de desktop. Aconselho que faça a verificação e aplique algo assim:


body {
  color: #e1e1e1; /* cor padrão para telas maiores */
}

@media (max-width: 768px) {
  body {
    color: #f1f1f1; /* cor mais clara para mobile */
  }
}

Isso diz ao navegador: "Se a largura da tela for menor que 768px (como celulares), mude a cor da fonte para #f1f1f1".

Assim, você não precisa subir outro projeto novo, só atualizar o repositório no GitHub, e a Vercel faz o deploy automático se estiver tudo certinho com o repositório conectado.

Espero ter ajudado. Conte com o apoio do Fórum na sua jornada. Fico à disposição.

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado