WordPress Hestia Pergunta: Altere a cor da entrada de pesquisa na barra superior

Um usuário perguntou ?

Olá,

Coloco um widget de pesquisa na barra superior e quero alterar a cor da fonte ao inserir texto nesse campo. Por padrão, a cor é branca.

Eu tentei adicionar as seguintes linhas ao meu style.css no tema filho:

.search-field.form-control {
	color: red !important;
}

Isso funciona para o Internet Explorer, mas não para Firefox, Chrome e Opera. Alguém tem uma ideia por favor?

(@emranemranx)

faz 3 anos

Olá Sanny,

Você pode tentar este código:

.search-form input[type=search] {
  color: red;
}

Obrigado!

lançador de tópicos

(@sanny)

faz 3 anos

Obrigado, mas isso não funciona. Ele altera apenas a cor de “entrada” do widget de pesquisa na barra lateral, mas não o widget de pesquisa dentro da barra de cabeçalho.

Esta resposta foi modificada há 3 anos por.

(@emranemranx)

faz 3 anos

Olá Sanny,

Compartilhe o link para seu site.

Obrigado!

lançador de tópicos

(@sanny)

2 anos, 11 meses atrás

Olá,

Não pude compartilhar o link porque meu blog é apenas local no momento.

Mas acho que tenho o estilo agora. Se eu quiser que a cor de entrada no campo de pesquisa seja vermelha, tenho que alterar o seguinte estilo:

.hestia-top-bar .widget .label-floating input[type="search"] {
    -webkit-text-fill-color: red !important;
}

O problema é que já é importante para que não viole. Procurei esse estilo nos arquivos do tema, ele está definido em hestia>inc>features>feature-header-settings.php em function hestia_get_top_bar_style().

$hestia_top_bar_text_color = get_theme_mod( 'hestia_top_bar_text_color', '#ffffff' );
	if ( ! empty( $hestia_top_bar_background ) ) {
		$custom_css .= '.hestia-top-bar, .hestia-top-bar .widget .label-floating input[type=search], .hestia-top-bar .widget.widget_search form.form-group:before, .hestia-top-bar .widget.widget_product_search form.form-group:before, .hestia-top-bar .widget.widget_shopping_cart:before {
			color: ' . $hestia_top_bar_text_color . '
		} 
		.hestia-top-bar .widget .label-floating input[type=search]{
			-webkit-text-fill-color:' . $hestia_top_bar_text_color . ' !important 
		}';
	}

Existe uma oportunidade de superá-lo? Por que já é importante?

Esta resposta foi modificada 2 anos, 11 meses atrás por. Esta resposta foi modificada 2 anos, 11 meses atrás por.