1

Estou utilizando o editor de texto do kendoUI

Eu preciso retirar o último botão do editor (inserir imagem).

A tag renderizada é o último , que possui dentro o button de imagem.

Eu tentei algo como:

kendo-toolbar-renderer:last-of-type{
    display: none!important;
}

Também tentei:

kendo-toolbar-renderer:last-child{
    display: none!important;
}

Porém ainda continua aparecendo o botão no editor, alguma alternativa?

3
  • 1
    Segundo a documentação vc pode adicionar ou remover os botões que vc quiser stackblitz.com/edit/angular-ubevvv?file=app/app.component.ts 24/06/2019 às 13:29
  • Com JS vc consegue remover na força bruta: var kendobts = document.querySelectorAll("kendo-toolbar-renderer"); kendobts[kendobts.length-1].outerHTML = '';
    – Meu ovo
    24/06/2019 às 15:51
  • Ou tente isso no CSS: kendo-toolbar-renderer:last-child{ display: none !important; }
    – Meu ovo
    24/06/2019 às 15:55

1 Resposta 1

1

A regra CSS que está lá na verdade é essa, porém repare que ele colocam um display:inline-block direto na tag sobrescrevendo o que está no CSS. O que eu te indico é fazer um regra mais forte tipo

.kendo-toolbar.k-toolbar .kendo-toolbar-renderer:last-of-type{
    display: none !important;
}

inserir a descrição da imagem aqui

Se isso não der certo um artifício é colocar o CSS depois que o JS for carregado para isso vc vai ter que colocar lá no final do documento como última tag antes do fechamento do </body> uma tag <style> para testar se assim esse CSS vai sobrescrever o que foi renderizado antes.

Ficaria algo como isso...

    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script>
    </script>

    <style>
        .kendo-toolbar.k-toolbar .kendo-toolbar-renderer:last-of-type {
            display: none !important;
        }
    </style>
</body>
</html>

Porém existe um efeito colateral de colocar o CSS no final do documento que vc pode ler nessa outra questão É uma boa prática inserir as tags do CSS no final do corpo do Body?

6
  • Tentei no css global e no index.html, continua aparecendo. 24/06/2019 às 13:52
  • Tenta colocar isso no css e ve se o ícone some [title="Insert image"] { display: none !important; }
    – hugocsl
    24/06/2019 às 13:55
  • Não deu certo, de qualquer forma eu precisaria que sumisse o botão pois eu queria que não utilizasse essa propriedade 24/06/2019 às 14:02
  • 1
    @VeroneseComS na verdade era só um teste para ver se funcionaria no filho e não no pai. Mas se mesmo assim o CSS não pegou fica complicado.... Acho que eu não consigo te ajudar com muito mais que isso :/
    – hugocsl
    24/06/2019 às 14:04
  • obrigado de qualquer forma, se eu conseguir posto aqui 24/06/2019 às 16:48

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .