Incluir % de desconto por forma de pagamento na pagina do produto

Formas de Pagamento
1

Gostaria de incluir o % de desconto aplicado a cada forma de pagamento, sendo 10% para o PIX e 5% para boleto no local indicado na imagem.

image
image1053×604 149 KB

2

CSS

span.accordion-toggle:has(>img[alt="Pix"]) b:before {
    content: "(10% Off) - ";
}

span.accordion-toggle:has(>img[alt="Boleto Bancário"]) b:before {
    content: "(5% Off) - ";
}

image
image963×741 135 KB

2 curtidas
3

com um pouco mais de style

span.accordion-toggle:has(>img[alt="Pix"]) b:before {
    content: "10% Off";
    background: #00800030;
    padding: 5px 10px;
    border-radius: 5px;
    color: green;
    margin-right: 10px;
    border: solid 1px green
}

span.accordion-toggle:has(>img[alt="Boleto Bancário"]) b:before {
    content: "5% Off";
    background: #ffff0033;
    padding: 5px 10px;
    border-radius: 5px;
    color: #999900;
    margin-right: 10px;
    border: solid 1px #999900
}

image

4 curtidas
4

Obrigado Leonardo.
Mas não funcionou. Antes do código CSS fica um “X” dentro de um quadro vermelho com a frase “Expected RPAREN at line 17, col 27.” E dá como “Erro de sintaxe” na hora de salvar, daí abortei a operação.

5

Sim, pq estou usando HAS um comando que a LI não reconhece, mas o navegador sim.

2 curtidas
6

Valeu, Leonardo!
Ficou muito bom!
Obrigado.