6
respostas

[Dúvida] Legendas e descrição das imagens sumiram....

Olá!

Minhas imagens estão carregando no projeto mas sem as legendas e descrições. Tentei encontrar o problema mas não estou conseguindo.

Vou compartilhar meu repositório via Git:

https://github.com/jhony-jhon/Alura-Space/tree/main

Segue também o print das imagens como estão na Home...

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

Se alguém puder me ajudar, agradeço. Meu projeto está diferente do Bruno, pois ele pegou o inicial e não o completo que tinha feito em outra formação...

No aguardo.

6 respostas

Alguém???

Ninguém pra dar um help ai gente? Quero terminar essa formação do Django...

Tô empacado no projeto com o bug que não encontrei e pra não ficar sem estudar estou fazendo outros cursos enquanto isso...

Eita! Nenhum Scubba pra ajudar gente esse aluno perdido no projeto do Django?

Quero finalizar essa formação mas não consegui encontrar o erro que está causando a legenda e descrição das imagens para não carregar...

Ainda no aguardo...se alguém puder auxiliar agradeço muito.

Boa tarde, João! Obrigada por aguardar o retorno :)

O problema ocorre porque tanto o título quanto a descrição, além do fundo do card, estão na cor branca, o que faz com que não sejam visíveis. Para resolver isso, basta acessar o arquivo style.css na pasta setup/static e adicionar a cor da fonte para a classe .card__info. Exemplo:

.card__info {
    color: red;
    font-size: 1.2rem;
    padding: 0 1.5rem 1rem 1.5rem;
}

Com essa alteração, tanto o título quanto a descrição serão exibidos corretamente, como mostrado abaixo:

Interface de um site com fundo azul escuro, contendo um título 'Navegue pela galeria' e botões de filtro para buscar por tags: Nebulosa, Estrela, Galáxia e Planeta. Abaixo, há um card apresentando a Nebulosa de Carina, com uma imagem colorida do espaço destacando uma formação de poeira cósmica iluminada por estrelas. No canto superior direito da imagem, há um marcador semitransparente escrito 'Estrelas'. O título do card, 'Carina Nebulosa', está em vermelho, seguido pelo nome 'Carina-Nebula' em fonte menor abaixo.
Usei a cor vermelha apenas para destaque, mas sinta-se à vontade para escolher outra cor que preferir, como uma cor específica ou até mesmo um código hexadecimal, por exemplo: color: #ff5733.

Espero ter ajudado. Abraços e bons estudos!

Olá Nádia! Obrigado pelo retorno!

Eu percebi algo no meu inspecionar do projeto no navegador. Ele não está carregando as atualizações que estou fazendo no projeto. Eu inclui um link icon pra mostrar o icon da alura space no navegador e ele não aparece porque olhando a área de inspecionar, o link que coloquei no projeto no VSCode não está sendo incluído. Não sei porque isso está acontecendo. Estou usando o runserver do python. Ele deveria pegar as modificações acredito....

Poderia me ajudar?

Eu vou compartilhar mais uma vez meu repositório como está pra que você possa dar uma olhada. Eu não sei o que está acontecendo que agora a cada momento aparece um problema novo no projeto e eu fico empacado no curso.

Segue link do repositório. Eu já tentei a ajuda do Co-Pilot mas as soluções que ele me fornece bagunça ainda mais o projeto...

https://github.com/jhony-jhon/alura-space

Fico no aguardo, se puder me ajudar agradeço. Estou enfrentando bastante dificuldades com esse projeto e isso está emperrando um pouco meu progresso na formação Django. Falta somente este curso para finalizar a formação...

Oi João!

O Django por padrão realiza um recarregamento ao vivo, ou seja, ele reinicia o servidor sempre que detecta mudanças no código ou nos modelos, mas ele não força a atualização da página no navegador.

Para implementar o recarregamento ao vivo da página no navegador, você pode usar a biblioteca django-browser-reload. Para isso, instale a biblioteca digitando no terminal:

pip install django-browser-reload

Após isso, no arquivo settings.py, onde ficam as configurações do projeto, adicione a biblioteca browser-reload:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'django_browser_reload',
    'apps.galeria.apps.GaleriaConfig',
    'apps.usuarios.apps.UsuariosConfig'
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
    'django_browser_reload.middleware.BrowserReloadMiddleware'
]

Já em urls.py, adicione a rota de recarregamento:

from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('apps.galeria.urls')),
    path('', include('apps.usuarios.urls')),
    path("__reload__/", include("django_browser_reload.urls")),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Por fim, no arquivo base.html adicione o código de carregamento desta biblioteca:

{% load static %}
{% load django_browser_reload  %}

Com essa configuração, se você alterar alguma letra, uma cor, uma fonte, tudo relacionado a estética do site, o navegador também será atualizado automaticamente. Exemplo:

Gif que mostra a alteração de uma frase do código e automaticamente mostra a mudança no navegador

Sobre o ícone, você pode adicionar o caminho no arquivo base.html, que é responsável por servir de molde para todas as outras páginas html do seu projeto:

<link rel="icon" href="{% static '/assets/favicon/Favicon 48px 2.png' %}">

Abraços e bons estudos!