Quebra de texto quebrada na visualização móvel devido ao componente de tema Easy Footer

Suporte
1

Em https://community.drownedinsound.com/, nas últimas horas, algo aconteceu com o site onde a quebra de linha não está mais sendo aplicada, juntamente com outros comportamentos estranhos na interface do usuário. Isso está acontecendo apenas na visualização móvel.

image
image1920×779 190 KB

Existem alguns tópicos lá com pessoas reclamando do mesmo comportamento, então isso não é algo específico do meu usuário:
https://community.drownedinsound.com/t/thread-titles-arent-wrapping/66342

Você pode ver pelos horários das postagens que isso começou a acontecer aproximadamente 12 horas atrás, então 20:30 (CEST) em 08/05/2022.

1 curtida
2

Olá,

Parece que isso é causado por este link: Easy Responsive Footer
O componente tem uma linha de CSS #main-outlet que causa isso.

Há outro relato sobre este problema no tópico do componente de tema.

Você pode usar esta correção rápida até que seja resolvido.
Vá para /admin/customize/themes e crie um novo componente.
Clique em CSS da seção móvel e adicione o seguinte.

#main-outlet {
  width: 100%;
  max-width: 100%;
}

Screenshot 2022-05-09 at 10.49.53
Screenshot 2022-05-09 at 10.49.53323×208 12.4 KB

7 curtidas
3

Eu atualizei a postagem acima. Esqueci de sobrescrever a largura máxima. @ma0sm, @AquaL1te

3 curtidas
4

Olá! Obrigado por isso. No entanto, quando tento aplicar a correção rápida nas configurações de administrador, recebo esta mensagem:

A edição de temas remotos está desativada no Discourse. Entre em contato conosco se precisar de ajuda para migrar temas remotos personalizados para um tema local.

Portanto, parece que precisaremos de alguma ajuda de vocês com isso :slight_smile:

2 curtidas
5

Você adicionaria um novo componente de tema com o trecho de código extra. :+1:

  • Vá para /admin/customize/themes
  • Clique em instalar e depois em criar novo
  • Dê um nome e selecione ‘componente’.
  • Criar
  • Adicione-o ao seu tema
  • Clique no botão Editar CSS/HTML e cole o código no campo CSS na aba Mobile
  • E salve
4 curtidas
6

Obrigado! Parece que isso resolveu! :grin:

3 curtidas
7

Parece bom! Muito obrigado pela sua rápida ajuda!

7295b164b20a377a265b16e81812bb894b2c89b5
7295b164b20a377a265b16e81812bb894b2c89b53326×974 356 KB

mas há mais preenchimento do que havia antes, eu acho. Isso é algo que será resolvido quando a correção completa estiver em vigor?

1 curtida
8

Acho que é porque o anúncio não se ajusta à largura do celular. Você pode tentar desativar o Rodapé responsivo fácil e o outro componente que você criou com o trecho que postei antes. Apenas para verificar se o problema de preenchimento é dos anúncios ou de outra coisa?

Acho que encontrei uma solução possível para isso. :thinking:

Você poderia adicionar isso ao mesmo novo componente que você criou antes para verificar como funciona? Apenas cole abaixo do trecho anterior @dis_whiterussian

.wrap {
  margin-left: unset;
  margin-right: unset;
}
5 curtidas
9

Obrigado, isso parece ter resolvido!

3 curtidas
12

Adicionei uma correção ao easy footer

5 curtidas
13

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.