Torne as traduções do tema acessíveis via CSS

Na verdade, as configurações do tema são acessíveis via CSS, mas não as traduções do tema.

Seria bom torná-las traduzíveis.

Por exemplo, no componente de tema DiscoTOC, temos essa configuração:

usada no CSS:

Adicionar texto via CSS é mais ou menos um paliativo de última instância, pois não é acessível. Acredito que não devêssemos incentivá-lo oferecendo suporte com recursos adicionais.

8 curtidas

Seria possível fazer algo assim através de um plugin?

Um plugin para habilitar traduções em SCSS… tudo é possível, mas ficaria muito bagunçado. Por exemplo, você precisaria de alguma forma compilar diferentes arquivos CSS para cada localidade. Recomendo fortemente não tentar fazer isso.

Uma ideia possível… mas não uma recomendação (ou seja, se você tentar fazer isso, estará por conta própria :stuck_out_tongue: )

Entendo que essa é uma má ideia

Você poderia fazer algo assim no JavaScript do tema

document.documentElement.style.setProperty('--my-translation-name', `"${ I18n.t(themePrefix("my-translation-name")) }"`);

E então no CSS

 &:before {
    content: var(--my-translation-name);
  }

Isso pode falhar de várias maneiras: se você colocar uma aspa ou caracteres especiais na tradução, vai quebrar. Se tentar usá-lo no IE11, também vai quebrar.

5 curtidas

Também não apoio tornar as traduções acessíveis no CSS do tema :+1:

Quanto ao exemplo em sua postagem @evantill, ele será removido na próxima atualização desse componente do tema.

8 curtidas

Este tópico foi automaticamente fechado após 3 horas. Novas respostas não são mais permitidas.