- From: Christoph Päper <christoph.paeper@crissov.de>
- Date: Mon, 7 Jul 2014 23:56:18 +0200
- To: www-style list <www-style@w3.org>
Tab Atkins Jr. <jackalmage@gmail.com> @ 2014-05-23:
> On Thu, May 22, 2014 at 2:09 AM, James Craig <jcraig@apple.com> wrote:
>> <ul class="io">
>> <li>2+2</li>
>> <li>4</li>
>> </ul>
>>
>> ⋗ 2+2
>> ⋖ 4
>>
>> Input: 2+2
>> Output: 4
>
> /* Shared system for all the non-speak-as details of the counter style */
> @counter-style io { system: cyclic; symbols: '⋗' '⋖'; suffix: " "; }
>
> /* Localized systems */
> @counter-style io-en { system: extends io; speak-as: io-en-spoken; }
> @counter-style io-es { system: extends io; speak-as: io-es-spoken; }
> @counter-style io-de { system: extends io; speak-as: io-de-spoken; }
>
> /* Spoken systems */
> @counter-style io-en-spoken { system: cyclic; symbols: "Input: ",
> "Output: "; speak-as: words; }
> @counter-style io-es-spoken { system: cyclic; symbols: "Entrada: ",
> "Salida: "; speak-as: words; }
> @counter-style io-de-spoken { system: cyclic; symbols: "Eingang: ",
> "Ausgang: "; speak-as: words; }
>
> /* Selectors to actually assign the counter styles */
> ul.io:lang(en) { counter-style: io-en; }
> ul.io:lang(es) { counter-style: io-es; }
> ul.io:lang(de) { counter-style: io-de; }
I’m not sure I completely understand the problem, but this looks saner:
:root, /* default */
:root:lang(en) {--input: "Input"; --output: "Output";}
:root:lang(es) {--input: "Entrada"; --output: "Salida";}
:root:lang(de) {--input: "Eingabe"; --output: "Ausgabe";}
@counter-style io {
system: cyclic;
symbols: '⋗' '⋖';
suffix: " ";
speak-as: io-spoken;
}
@counter-style io-spoken {
system: cyclic;
symbols: var(--input), var(--output);
suffix: ": ";
speak-as: words;
}
ul.io {
counter-style: io;
}
Received on Monday, 7 July 2014 21:56:47 UTC