8
respostas

Projeto não fica igual quando abro o link no github ou vercel

https://asleticia.github.io/Alura-Books/

Meu projeto está ficando assim quando crio o link, já exclui o projeto e criei de novo porém ele continua do mesmo jeito. Também criei o link pelo vercel e ele fica com a mesma aparência. Ele fica perfeito quando abro no Visual Code en tão não estou entendendo o que está acontecendo, se alguém puder ajudar o link do projeto no GitHub é esse: https://github.com/ASLeticia/Alura-Books

8 respostas

Olá leticia, tudo bem?

Me parece que o site não está encontrando o seus arquivos de estilo.

No caso eu sugiro que você indique a ele e tente novamente.

Dentro da tag header inclua:

<link rel="stylesheet" href="../Styles/Topico.css">
<link rel="stylesheet" href="../Styles/banner.css">
<link rel="stylesheet" href="../Styles/carrossel.css">
<link rel="stylesheet" href="../Styles/contato.css">
<link rel="stylesheet" href="../Styles/header.css">
<link rel="stylesheet" href="../Styles/rodape.css">

Eu coloquei e ainda sim não funcionou.

Vi no seus commits que você adicionou assim:

<link rel="stylesheet" href="Styles/Topico.css">
<link rel="stylesheet" href="Styles/banner.css">
<link rel="stylesheet" href="Styles/carrossel.css">
<link rel="stylesheet" href="Styles/contato.css">
<link rel="stylesheet" href="Styles/header.css">
<link rel="stylesheet" href="Styles/rodape.css">

Tentou adicionar o ../ antes do Styles ? Tenta por o ../ o VSCode vai indicar o caminho.

Caso isso não funcione, teremos que dar uma olhada melhor no seu codigo para ver o que está havendo

Sim, eu tentei com o ../ porém eu VS ta falando que está errado (../styles fica vermelho), mesmo assim salvei e coloquei só que deu errado, dai tentei tirando os pontos e também deu errado.

Clonei seu repositorio e de fato no localhost ele está funcionando perfeitamente.

Também não havia reparado que você fez os imports dos estilos direto na pagina Style.css, então desculpa pelo engano.

Reparei no entanto, que seus imports estão errados, alguns estão com "s" minusculo e outros "S" maiusculo. O VSCode entende que é para puxar aquele link, no entanto pode ser que o vercel não entenda, tente fazer a modificação desses itens e veja se alguma coisa acontece.

@import url("Styles/header.css");
@import url("Styles/banner.css");
@import url("Styles/carrossel.css");
@import url("Styles/Topico.css");
@import url("Styles/contato.css");
@import url("Styles/rodape.css");

Eu corrigi e no VSCode deu certo, só que ele não está responsivo para 1728px, eu abri pelo computador e está como ser fosse 1024px. No GitHub ele se encontra com o mesmo problema de antes.

No caso da responsividade, você vai precisar criar a mediaquery para isso, analisar quais os elementos que estão ficando fora e ir ajustando conforme a necessidade. Testei aqui no github pages e ficou da forma como deveria, está com todos os estilos que você colocou, então acredito que o problema agora seja somente a responsividade certo?

Sim, vou dar uma olhada. Muito obrigada!