Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] imagens svg não estão aparecendo na página

Olá, estou com uma dúvida. Quando aberto com Live Server as imagens svg estão aparecendo normalmente, mas quando aberto na página criada no github as imagens svg não aparecem. Anexei imagens para demonstrar o que está ocorrendo.

link do codigo no girhub: https://github.com/isasmelo/portifolio link da página: https://isasmelo.github.io/portifolio/

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

2 respostas

Opa, boa tarde Isabela! Vi que no seu repositório, o arquivo .svg que esta no css ele está sem aspas simples. Exemplo de como era para estar:

.light {
  --label-icon: url('assets/moon-sharp.svg');
  --cor-primaria: #fafafa;
  --cor-secundaria: #191919;
  --cor-terciaria: #5435d0;
  --cor-hover: #e8e8e8;
  --highlight-color: #00000033;

  --icon-calendar: url('assets/calendar-light.svg');
  --icon-location: url('assets/location-light.svg');
}

De acordo com meus conhecimentos essas soluções irão ajudar... Qualquer coisa responde aqui novamente se deu algo errado.

solução!

Olá Isabela, tudo bem?

O Nickolas deu uma boa sugestão e peço que você tente fazer o que ele mencionou, mas para contribuir na solução do seu tópico deixo algumas sugestões:

Fiz os teste e de fato o erro mencionado acontece, a fim de testar,l se era um erro no github page fiz o deploy em um servidor diferente chamado netfly que me gerou o seguinte link e como você pode observar funcionou tranquilamente, por conta disso peço que revise alguns pontos:

  • Certifique-se de que os nomes dos arquivos e extensões estejam corretos, incluindo a distinção entre letras maiúsculas e minúsculas. O GitHub Pages é sensível a essas diferenças, então verifique se os nomes dos arquivos estão exatamente iguais aos que estão no repositório.

  • Verifique se as permissões de acesso aos arquivos estão configuradas corretamente no GitHub. Certifique-se de que os arquivos SVG tenham permissões de acesso adequadas para que possam ser carregados e exibidos corretamente na página.

Portanto, caso o erro persista você utilizar de outras ferramentas de deploy que pode ser o Netfly ou o Vercel que é mais simples, pois faz conexão com o repositório do seu github.

OBS: Nesse link gerado suas redes sociais foram apagadas, para manter a privacidade das mesma.

Também gostaria de dizer que ficou incrível seu projeto, adorei o recurso de alternar entre o dark-mode e light-mode

Espero ter ajudado, qualquer dúvida, me coloco à disposição! Bons estudos!

Sucesso

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!