Alterar cor de texto na versão mobile

[Lucy Elrich Sinskye]

Detalhes da questão

Endereço do fórum: www.rpghogwarts.org
Versão do fórum: PhpBB2

Descrição

Boa noite,
quando abro meu fórum na versão mobile, os textos que são escritos em qualquer caixa ou campo de texto ficam em cor cinza claro, enquanto a caixa de texto é branca, ou seja, não tem como ler nada do que você está escrevendo.

Tentei arrumar isso seguindo o tutorial de como personalizar a versão mobile, porém acabei não conseguindo. Alguém poderia me ajudar com qual código exatamente devo acrescentar ao meu CSS para arrumar isso?

[Kyo Panda]

Olá,

Vá em Painel de controle › Módulos › HTML & JavaScript › Gestão dos códigos JavaScripts › Criar um novo JavaScript e adicione esse código com Investimento em Todas as páginas:

Código:

; (function ($) {
    'use strict';

    $(function () {
        if ($('#mpage-body-modern').length) {
            $('<style>', {
                type: 'text/css',
                text: '' +
                    '#mpage-body-modern input,' +
                    '#mpage-body-modern textarea,' +
                    '#mpage-body-modern select,' +
                    '#mpage-body-modern #text_editor_iframe {' +
                        'color: #333;' +
                  '}' +
                ''
            }).appendTo('head');

        }
    });
}) (jQuery);

[Lucy Elrich Sinskye]

Não existe como alterar isso sem utilizar um código Java?

Pois sei que tem um código no meu CSS que está configurando para ficar na cor atual, porém pelo que vi ele está afetando a versão clássica e a versão mobile.

[Kyo Panda]

O problema é que o CSS do fórum normal não é aplicado ao tema (eu acho)*. Você pode tentar adicionar ao seu CSS:

Código:

#mpage-body-modern input,
#mpage-body-modern textarea,
#mpage-body-modern select,
#mpage-body-modern #text_editor_iframe {
  color: #333;
}

* Testei aqui e ele o aplica. Nesse caso o CSS acima deve funcionar. Peço desculpas pelo Javascript desnecessário. >-<"

[Lucy Elrich Sinskye]

Teste aqui e não funcionou...
Talvez isso possa ajudar.. O código que tenho para versão clássica que altera isso é o seguinte código:

Código:

input,textarea, select, #text_editor_iframe {
   color : #f0f0f0;
   font: normal 11px Trebuchet MS;
   border-color : #f0f0f0;
   }
input.post,textarea.post,select,#text_editor_iframe,textarea.inputbox{
   background-color:#383838}

O primeiro altera o texto e o segundo altera o fundo. Qualquer um dos dois que eu consiga alterar na versão mobile já me ajuda, pois do jeito que está realmente é meio impossível postar no fórum usando a versão mobile.

[Kyo Panda]

Não consegui encontrar a peça do CSS que passei em seu código. Foi removido?

---

O código que lhe passei tenta fazer pela primeira opção, alterando a cor do texto, apenas colocando uma condição (#mpage-body-modern) a mais para apenas funcionar na versão mobile (para que não haja conflitos com o CSS do tema normal).

Tente adicionar ao fim do seu CSS:

Código:

#mpage-body-modern input,
#mpage-body-modern textarea,
#mpage-body-modern select,
#mpage-body-modern #text_editor_iframe {
  color: #333 !important;
}

Caso não funcionar, mantenha o código aplicado e me avise aqui no tópico para que possa verificar os porquês do problema, tudo bem? ^-^

[Lucy Elrich Sinskye]

Acrescentei o código novamente ao fórum, este que você passou por último, porém continua não funcionando =/

Ps.: Dessa vez deixei o código ativado, mesmo que não esteja funcionando.

[Kyo Panda]

No seu CSS, procure por isso:

Código:

.sonsa:hover{
  background-image:url('http://i.imgur.com/Bo83pRr.png';
  opacity:1;}

Está faltando um ) após uma propriedade, o que causa os códigos CSS abaixo disso não funcionarem (incluso o código que te passei). Apenas adicione um ) após "'https://i.imgur.com/Bo83pRr.png'" e antes de ";":

Código:

.sonsa:hover{
  background-image:url('http://i.imgur.com/Bo83pRr.png');
  opacity:1;}

[Lucy Elrich Sinskye]

Agora deu certo \o/

Muito obrigada @Kyo Panda

Realmente não tinha notado aquele código aberto, no que acho até mesmo que é um código inativo que acabou ficando para trás sem ser removido.

[Cream]

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para "Questões resolvidas".