Alterar cor da fonte da variaçao

Layout
1

image
Olá, estou com dúvida para alterar a cor da fonte da variação, qual css permite essa alteração

2

Olá Cristhofer, tudo bem?

Existe esse caminho para alterar a cor da fonte das variações antes de ser selecionada:

.atributo-comum a span {
color: #000 !important;
}

Depois que for selecionada ele muda para ativa, ai tem que mudar também:

.produto .atributos .atributo-comum ul li.active a span {
color: #fff !important;
}

Isso é só para a fonte e não para o background ou a borda.
Espero que dê certo. Caso contrário, envia seu link no próximo comentário que eu dou uma olhada.

:wink: :+1:

3

image

Deu certo em relação a fonte meu rei!
Porém a que tenho em estoque (0.24mm) está na cor toda preta, impossibilitando de ver.

meu site é Linha de Pesca Multifilamento Saigon 4X | Fish Store MS - Fish Store MS - A Loja do Pescador

4

Que bom que caminhamos para o lado certo.
Não está aparecendo, pois usou exatamente as cores que coloquei no código.

Altere a cor #000 (que é o preto) e #fff pela cor que deseja.
Coloquei essas 2 como exemplo apenas.

Para escolher a cor e pegar o código, pode usar esse link abaixo:
http://cdn.awsli.com.br/download/cores.html#FFFFFF

5

Peço desculpas, acabei me descuidando desse detalhe da cor #000.
Sobre o background do “quadrado” que está preto, é possível alterá-lo?

6

É possível sim. Segue bem detalhado:

Para a borda padrão
.produto .atributos .atributo-comum ul li a {
border: solid 1px #fff !important;
}

Para a borda no over:
.produto .atributos .atributo-comum ul li a:hover {
border: solid 1px #fff !important;
}

Para a borda no ativo:
.produto .atributos .atributo-comum ul li.active a {
border: solid 1px #fff !important;
}

====

Para o background padrão:
.produto .atributos .atributo-comum ul li a {
background: #fff !important;
}

Para o background no over:
.produto .atributos .atributo-comum ul li a:hover {
background: #fff !important;
}

Para o background no ativo:
.produto .atributos .atributo-comum ul li.active a {
background: #fff !important;
}

=======

Caso vá mudar a borda e o background, use assim:

Padrão:
.produto .atributos .atributo-comum ul li a {
border: solid 1px #fff !important;
background: #fff !important;
}

Over:
.produto .atributos .atributo-comum ul li a:hover {
border: solid 1px #fff !important;
background: #fff !important;
}

Ativo:
.produto .atributos .atributo-comum ul li.active a {
border: solid 1px #fff !important;
background: #fff !important;
}

Lembrando que deve-se alterar as cores que coloquei como exemplo #fff

2 curtidas
7

Sensacional! Muito agradecido pela dedicação e tirar um tempo para me ajudar nesse caso! Um abraço, que 2022 seja um ótimo ano para nós.

1 curtida