Prioridade/Gravidade: Baixa. Plataforma: Confirmado no Firefox 127.0 no Windows 10 e Chrome 125.0.6422.165 no Android 14. Descrição: Veja abaixo. Passos para reproduzir: Carregue uma imagem com resolução de 690×500 pixels ou inferior e redimensione-a manualmente (por exemplo, ) ou coloque-a em um [grid] (por exemplo, [grid]  [/grid]).
Comportamento esperado
O funcionamento do lightboxing no Discourse é feito para que, se a imagem foi reduzida para caber na postagem, ela seja exibida em lightbox para que possa ser clicada para ver a resolução completa.
O problema
Há um bug em como isso está implementado atualmente: ele compara apenas a resolução original da imagem com as configurações de “largura máxima da imagem” e “altura máxima da imagem” do site (por padrão, 690×500 pixels), ignorando o redimensionamento manual e as grades de imagem. Isso tem a consequência de que imagens que foram reduzidas podem não ser exibidas em lightbox, se estiverem abaixo de [largura máxima da imagem]×[altura máxima da imagem].
Aqui está um exemplo de falha na aplicação do lightbox quando as imagens foram reduzidas manualmente – passe o mouse sobre as imagens a seguir, e você verá que elas são exibidas de forma inconsistente; clique em uma exibida em lightbox e você verá que algumas delas não aparecem ao pressionar para a esquerda ou para a direita:[2]
O problema nas grades de imagem é que as grades praticamente sempre redimensionam – e muitas vezes até cortam – as imagens, o que se torna um problema quando elas não podem ser clicadas para ver a imagem completa.
A solução originalmente proposta…
A solução seria garantir que:
O lightbox compare o tamanho da imagem na página com sua resolução original, e que
As imagens em grades sejam sempre exibidas em lightbox.
Pelo que entendo, a aplicação dos lightboxes é feita no lado do cliente, então acho que não deve ser proibitivamente difícil, pelo menos!
Esta parte do problema foi mencionada no fórum antes, um tópico em que uma conclusão mais ou menos semelhante para qual seria a solução foi tirada. ↩︎
Originalmente, isso causou problemas de formatação significativos devido a um problema que relatei separadamente, mas no momento de editar esta postagem e escrever esta parte, já foi corrigido. ↩︎
Uma ideia que tive foi esta: Há alguma razão para não usar lightboxes em todas as imagens? Pelo menos em imagens que caberiam confortavelmente na barra de informações e no pequeno ícone de “expandir” no celular sem cobrir muito da imagem. O lightbox tem valor de duas maneiras além de apenas permitir que você veja a imagem em alta resolução:
Ele exibe o texto alternativo (crucialmente, algo muito mais provável de ser fornecido por um postador do que o texto do título, pois o texto alternativo é pré-preenchido e a sintaxe para o texto do título é mais obscura), e
A imagem não é omitida ao navegar pelas imagens depois de clicar em um lightbox.
Existe alguma razão para não usar lightboxes em imagens que podem ser vistas por completo?
Uma opção pode ser simplesmente (além de usar lightboxes em todas as imagens em grades) usar lightbox em todas as imagens acima de um certo tamanho na página – digamos, acima de 72×72 pixels ou algo assim (estou pensando em linhas – qualquer coisa acima de ~3 linhas de tamanho). O que você acha?
Idealmente, eu gostaria que as configurações de redimensionamento fossem semelhantes a estes padrões de 690x500px, mas as configurações de lightbox fossem mais próximas de 72x72px (como qualquer imagem maior que um emoji grande ou do tamanho de um “adesivo”).
Parece que a intenção principal do lightbox é visualizar uma versão não escalonada da imagem, mas eu definitivamente o uso mais como uma galeria estilo carrossel. É por isso que é um pouco chocante quando algo com 502px de altura é tratado de forma diferente de algo com 499px de altura, especialmente quando estão na mesma grade.
Eu acho que essa é uma descrição perfeita do que eu estava pensando – esse é o único caso de uso onde você não gostaria de um lightbox, não é: quando a imagem é “parte do texto” ou “parte da formatação da postagem”.
Eu acho que essa é uma solução melhor no geral – separar as “imagens do lightbox acima do tamanho […]” em sua própria configuração com um padrão muito menor. Faria sentido que fosse diferente da implementação atual de duas outras maneiras:
Deveria julgar pelo tamanho na página, em vez do tamanho original da imagem.
Provavelmente precisaria exceder ambas as dimensões, em vez de apenas uma – não consigo imaginar um caso de uso onde você gostaria que uma imagem de, digamos, 690x10 pixels (na página) fosse exibida em lightbox.
Como uma nota sobre casos de uso, às vezes incluo pequenas imagens no estilo de emoji – mas elas são de alta resolução, para que não fiquem borradas em telas de alta DPI. Por exemplo:
! Esta imagem não deveria ser exibida em lightbox, pois 1) é um emoticon, mas mais importante, 2) o pequeno ícone de expansão no canto inferior direito cobriria a maior parte dela no celular. No momento, ela não é exibida em lightbox porque o tamanho original da imagem de alta resolução é inferior a 690x500 pixels (372x468 pixels, para ser exato), mas não deveria ser exibida em lightbox, apesar de ter sido redimensionada – o critério verdadeiramente importante a ser julgado é o seu tamanho na página.
