Plots2: Corrigir o estilo responsivo do botão "Inserir cabeçalho" na barra de ferramentas

Criado em 21 mar. 2021  ·  3Comentários  ·  Fonte: publiclab/plots2

No editor legado, o ícone do botão "Inserir cabeçalho" da barra de ferramentas desaparece completamente quando você redimensiona a janela.
Especificamente, se a largura da janela for maior que 700 px e menor que 1000 px.

Vídeo

(O botão do cabeçalho é o H no vídeo abaixo)

https://user-images.githubusercontent.com/4361605/111892783-b005ec80-89bb-11eb-81e6-14d68b3a9422.mov

Como reproduzir

Vá para qualquer lugar que use o editor legado em nosso site. Isso inclui notas, wikis e perguntas.
Também inclui /wiki/new .

  1. Por exemplo, vá para esta nota em nosso servidor de teste na stable.
  2. Redimensione a janela como acima e observe como o H desaparece.

Correções sugeridas

Você terá que fazer alguma pesquisa na base de código e nas folhas de estilo CSS.

A parcial da barra de ferramentas está em /app/views/editor/_toolbar.html.erb :
https://github.com/publiclab/plots2/blob/07a243da39702501d0f5d4de8a3683a24d680a38/app/views/editor/_toolbar.html.erb#L29 -L44

Percebo que o ícone está envolvido em um span com a classe d-md-none , então pode ser isso. Mas definitivamente brinque com isso e veja o que você encontra!

Este é um grande problema para alguém que acabou de concluir um FTO e quer algo um pouco mais desafiador.

Poste um comentário aqui para reivindicar esse problema e, depois, fique à vontade para postar um comentário pedindo ajuda se tiver dúvidas!

CSS easy feature help wanted

Comentários muito úteis

@waridrox Legal, isso foi rápido! Vá em frente, basta postar um comentário aqui se tiver dúvidas.

Todos 3 comentários

Posso experimentar, por favor? @ noi5e

@waridrox Legal, isso foi rápido! Vá em frente, basta postar um comentário aqui se tiver dúvidas.

Você sabe o que dizem - às vezes a resposta está bem na sua frente ...

https://github.com/publiclab/plots2/blob/07a243da39702501d0f5d4de8a3683a24d680a38/app/views/editor/_toolbar.html.erb#L29 -L43
Nesse caso, o código na linha 40 estava aplicando um elemento span desnecessário que estava em conflito com os estilos. Remover isso simplesmente resolveu o problema: D

_Nenhuma funcionalidade é prejudicada após a mudança, embora muito tempo tenha sido gasto para encontrar isso 😅_

https://user-images.githubusercontent.com/58583793/111906743-2831e800-8a78-11eb-953d-58dfe534048b.mp4

Eu revertei as cores, elas eram apenas para fins de depuração.

Esta página foi útil?
0 / 5 - 0 avaliações