Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add legacy Chrome styles #31

Closed
r12a opened this issue Feb 3, 2021 · 4 comments
Closed

Add legacy Chrome styles #31

r12a opened this issue Feb 3, 2021 · 4 comments

Comments

@r12a
Copy link
Contributor

r12a commented Feb 3, 2021

The following styles are non-standard counter styles supported by Chrome. They should be added to the document.

@counter-style ethiopic-halehame {
  system: alphabetic;
  symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1240' '\1260' '\1270' '\1280' '\1290' '\12A0' '\12A8' '\12C8' '\12D0' '\12D8' '\12E8' '\12F0' '\1308' '\1320' '\1330' '\1338' '\1340' '\1348' '\1350';
  suffix: '\1366 ';
}
@counter-style ethiopic-halehame-am {
  system: alphabetic;
  symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350';
  suffix: '\1366 ';
}
@counter-style ethiopic-halehame-ti-er {
  system: alphabetic;
  symbols: '\1200' '\1208' '\1210' '\1218' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1270' '\1278' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1348' '\1350';
  suffix: '\1366 ';
}
@counter-style ethiopic-halehame-ti-et {
  system: alphabetic;
  symbols: '\1200' '\1208' '\1210' '\1218' '\1220' '\1228' '\1230' '\1238' '\1240' '\1250' '\1260' '\1270' '\1278' '\1280' '\1290' '\1298' '\12A0' '\12A8' '\12B8' '\12C8' '\12D0' '\12D8' '\12E0' '\12E8' '\12F0' '\1300' '\1308' '\1320' '\1328' '\1330' '\1338' '\1340' '\1348' '\1350';
  suffix: '\1366 ';
}
@counter-style hangul {
  system: alphabetic;
  symbols: '\AC00' '\B098' '\B2E4' '\B77C' '\B9C8' '\BC14' '\C0AC' '\C544' '\C790' '\CC28' '\CE74' '\D0C0' '\D30C' '\D558';
}
@counter-style hangul-consonant {
  system: alphabetic;
  symbols: '\3131' '\3134' '\3137' '\3139' '\3141' '\3142' '\3145' '\3147' '\3148' '\314A' '\314B' '\314C' '\314D' '\314E';
}
@counter-style urdu {
  system: extends persian;
}

Source is https://chromium.googlesource.com/chromium/src/+/2414b7d5dfb36d3e747aefa2d842e1e9133dc0bf/third_party/blink/renderer/core/css/predefined_counter_styles.css

@xfq
Copy link
Member

xfq commented Feb 4, 2021

Are we going to add these to the relevant sections (Ethiopic, Korean (Hangul), Urdu (Arabic?))?

Or should we add a new section for all vendor-specific experimental/nonstandard styles?

@r12a
Copy link
Contributor Author

r12a commented Feb 4, 2021

My plan was to add to the appropriate sections – otherwise it gets complicated because it's hard to draw the line between vendor-specific and not. It also makes it easier to find them, if you're looking for alternatives for a given language/script. I was, however, planning to add notes to the sections mentioning that native support for these appears to be Chrome specific, although i've yet to test them on other browsers.

@r12a
Copy link
Contributor Author

r12a commented Jun 8, 2021

Here are interactive tests for each of the styles above. In each case, we are testing whether the browser recognises the style name when used in list-style-type: <style_name>, ie. whether the browser has built-in support for that name. Only Blink does.

I will, nonetheless, add these styles to the Ready-made Counter-styles document, since some people may want to use them on other browsers.

ethiopic-halehame
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20ethiopic-halehame-am%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome only

ethiopic-halehame-am
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20ethiopic-halehame-am%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome only

ethiopic-halehame-ti-er
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20ethiopic-halehame-ti-er%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome & Safari

ethiopic-halehame-ti-et
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20ethiopic-halehame-ti-et%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome & Safari

hangul
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20hangul%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome & Safari

hangul-consonant
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20hangul-consonant%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome & Safari

urdu
https://w3c.github.io/i18n-tests/exploratory/vanilla?text=%3Cstyle%3E%0Aol%20%7B%20padding%3A%200%202em%3B%20list-style-type%3A%20urdu%3B%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Col%3E%0A%3Cli%3Eone%3C%2Fli%3E%0A%3Cli%3Etwo%3C%2Fli%3E%0A%3Cli%3Ethree%3C%2Fli%3E%0A%3Cli%3Efour%3C%2Fli%3E%0A%3Cli%3Efive%3C%2Fli%3E%0A%3Cli%3Esix%3C%2Fli%3E%0A%3Cli%3Eseven%3C%2Fli%3E%0A%3Cli%3Eeight%3C%2Fli%3E%0A%3C%2Fol%3E&fontSize=36&width=500&height=500
Supported on: Chrome & Safari

@r12a
Copy link
Contributor Author

r12a commented Jun 8, 2021

Fixed by #43 (comment)

@r12a r12a closed this as completed Jun 8, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants