Desativar o estilo do sistema para elementos de entrada de formulário do Firefox

13

Eu uso um tema sombrio no Lubuntu chamado Dorian . Estou muito feliz com isso. No entanto, o Firefox parece herdar certas cores do sistema para seus elementos de entrada de formulário, dificultando sua visualização.

Por exemplo:

Exemplo de caixas de seleção Exemplo de botões

Se eu alterar a cor do primeiro plano, também devo alterar a cor do plano de fundo das caixas de texto, que está boa agora, mas está clara no escuro. Exemplo de caixa de texto

Eu posso imaginar resolver isso de várias maneiras:

  1. Adicione uma folha de estilos personalizada para o Firefox para reverter as alterações. (Eu uso o Stylish , por isso é trivial de implementar. No entanto, CSS com elementos de formulário parece complicado.)
  2. Modificações no Dorian (acho que você pode personalizar um tema GTK para programas específicos).
  3. Desative o addon Firefox-modificações do Ubuntu-Firefox .
  4. Encontre uma configuração no Firefox para impedir o carregamento de cores do sistema para elementos de entrada.
  5. Instale o Dorian Theme para Firefox . (Eu reluto nisso, já que Dorian não é atualizado ativamente e o Firefox é constantemente.)

Obviamente, também dou boas-vindas a outras soluções em que não pensei.

sondra.kinsey
fonte
Ré. "No entanto, CSS com elementos de formulário parece complicado", você pode obter orientação clicando com o botão direito do mouse nos elementos problemáticos e escolhendo "Inspecionar elemento" no menu de contexto.
DK Bose

Respostas:

19

As soluções baseadas em CSS são difíceis de acertar, na minha experiência. O da resposta de Michael funcionou em alguns sites, mas não em todos.

No Firefox 60, há uma solução mais fácil. Vá para about:confige defina o seguinte valor da sequência: widget.content.gtk-theme-override=Adwaita:light

(Você deve clicar com o botão direito do mouse e selecionar Novo -> String. A pesquisa gtk-theme-overridenão encontrará nada porque a configuração não está lá por padrão.)

Crédito para Martin Stránský: https://bugzilla.mozilla.org/show_bug.cgi?id=1283086#c7

John Lindgren
fonte
3
Ao contrário de muitas configurações do firefox, tive que reiniciar o Firefox para que isso surtasse efeito. Portanto, não se preocupe se não entrar em vigor imediatamente. Funciona perfeito embora!
Bryan cabeça
Os usuários do KDE podem definir esse valor como um nome de tema do KDE, como "brisa" ou "oxigênio".
Pistos
3

Você pode tentar a extensão Contraste de texto para temas escuros .

Além disso, essa solução CSS mais antiga ainda parece funcionar, embora seja provavelmente o que você está usando agora.

Redsandro
fonte
O segundo link ("solução CSS") não está mais funcionando. Você poderia elaborar a solução CSS? É possível alterar a folha de estilo global do agente do usuário do Firefox sem o uso de extensões?
Michael Martin-Smucker
Desculpe, eu não sei. Mudei para o Chrome porque às vezes considerava o estilo do Firefox peculiar, especialmente em uma área de trabalho escura.
Redsandro
1
I como este, porque ele me permite escolher quais sites eu quero forçar cores padrão para
smac89
2

Também uso um tema sombrio (Adapta Nokto) e já encontrei muitos sites que alteram a cor do texto nas entradas, mas presumo que a cor do plano de fundo seja branca (levando a um texto completamente ilegível).

Explorei a opção CSS e encontrei esta explicação para definir estilos de usuário padrão sem a necessidade de extensões do navegador. Resumo:

  1. Seu perfil do Firefox precisará de um userContent.cssarquivo no lugar certo. Você pode criá-lo assim:

    • Mude os diretórios para o seu perfil do Firefox:
      cd ~/.mozilla/firefox/<your profile>/
    • Crie um diretório "chrome" se ele não existir
      mkdir chrome
    • Crie um arquivo CSS neste novo diretório
      touch chrome/userContent.css
  2. Edite o userContent.cssarquivo recém-criado para incluir os estilos base que você deseja aplicar a todas as páginas.

  3. Reinicie o Firefox para ver as alterações.

Para iniciantes, adicionei isso ao meu arquivo CSS:

input, textarea {
  background-color: #fff;
  color: #222;
}

Isso pressupõe alguma familiaridade com CSS. Se é novo para você, está dizendo:

  • Encontre todos os elementos inpute textareana página
  • Tornar o fundo branco ( #fffé um código hexadecimal para branco)
  • Tornar a cor do texto em cinza escuro ( #222)

Existem muitos outros elementos que você pode estilizar, como buttone select, e você pode ser mais específico com suas entradas, como input[type=checkbox].

Isso não desativa exatamente o uso do tema do sistema, mas pelo menos permite substituí-lo e fornecer aos sites padrões que estão mais próximos do que eles esperam.

Michael Martin-Smucker
fonte