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 counters and list styles #1764

Merged
merged 18 commits into from
Sep 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions features/counter-reset-reversed.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
name: Reversed counter-reset
description: "The `reversed()` CSS function for `counter-reset` creates a counter that counts down."
spec: https://drafts.csswg.org/css-lists-3/#css-counter-reversed
group: counters
compat_features:
- css.properties.counter-reset.reversed
10 changes: 10 additions & 0 deletions features/counter-reset-reversed.yml.dist
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
# Generated from: counter-reset-reversed.yml
# Do not edit this file by hand. Edit the source file instead!

status:
baseline: false
support:
firefox: "96"
firefox_android: "96"
compat_features:
- css.properties.counter-reset.reversed
2 changes: 1 addition & 1 deletion features/counter-set.yml
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
name: counter-set
description: The `counter-set` CSS property creates (and optionally sets a value for) a counter, the numbers for a series of headings or ordered list items.
spec: https://drafts.csswg.org/css-lists-3/#propdef-counter-set
group: css
group: counters
2 changes: 1 addition & 1 deletion features/counter-style.yml
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
name: "@counter-style"
description: The `@counter-style` CSS at-rule sets custom counter styles for list items. For example, you can use a sequence of specific symbols instead of numbers for an ordered list.
spec: https://drafts.csswg.org/css-counter-styles-3/
group: css
group: counters
caniuse: css-at-counter-style
status:
compute_from: css.at-rules.counter-style
Expand Down
19 changes: 19 additions & 0 deletions features/counters.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
name: Counters (CSS)
description: The `counter-reset` and `counter-increment` CSS properties and the `counter()` and `counters()` functions automatically number headings or ordered list items.
spec: https://drafts.csswg.org/css-lists-3/#auto-numbering
caniuse: css-counters
group: counters
status:
compute_from:
- css.properties.counter-increment
- css.properties.counter-reset
compat_features:
- css.properties.counter-increment
- css.properties.counter-increment.list-item
- css.properties.counter-increment.none
- css.properties.counter-reset
- css.properties.counter-reset.list-item
- css.properties.counter-reset.none
- css.properties.counter-reset.reset_does_not_affect_siblings
- css.types.counters
- css.types.counter
90 changes: 90 additions & 0 deletions features/counters.yml.dist
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
# Generated from: counters.yml
# Do not edit this file by hand. Edit the source file instead!

status:
baseline: high
baseline_low_date: 2015-07-29
baseline_high_date: 2018-01-29
support:
chrome: "2"
chrome_android: "18"
edge: "12"
firefox: "1"
firefox_android: "25"
safari: "3"
safari_ios: "1"
compat_features:
# baseline: high
# baseline_low_date: 2015-07-29
# baseline_high_date: 2018-01-29
# support:
# chrome: "1"
# chrome_android: "18"
# edge: "12"
# firefox: "1"
# firefox_android: "4"
# safari: "3"
# safari_ios: "1"
- css.types.counter

# baseline: high
# baseline_low_date: 2015-07-29
# baseline_high_date: 2018-01-29
# support:
# chrome: "1"
# chrome_android: "18"
# edge: "12"
# firefox: "1.5"
# firefox_android: "4"
# safari: "3"
# safari_ios: "1"
- css.types.counters

# ⬇️ Same status as overall feature ⬇️
# baseline: high
# baseline_low_date: 2015-07-29
# baseline_high_date: 2018-01-29
# support:
# chrome: "2"
# chrome_android: "18"
# edge: "12"
# firefox: "1"
# firefox_android: "25"
# safari: "3"
# safari_ios: "1"
- css.properties.counter-increment
- css.properties.counter-reset

# baseline: high
# baseline_low_date: 2015-07-29
# baseline_high_date: 2018-01-29
# support:
# chrome: "2"
# chrome_android: "18"
# edge: "12"
# firefox: "1"
# firefox_android: "25"
# safari: "3"
# safari_ios: "2"
- css.properties.counter-increment.none
- css.properties.counter-reset.none

# baseline: high
# baseline_low_date: 2020-05-19
# baseline_high_date: 2022-11-19
# support:
# chrome: ≤83
# chrome_android: "83"
# edge: "12"
# firefox: "1"
# firefox_android: "25"
# safari: ≤13.1
# safari_ios: ≤13.4
- css.properties.counter-increment.list-item
- css.properties.counter-reset.list-item

# baseline: false
# support:
# firefox: "82"
# firefox_android: "82"
- css.properties.counter-reset.reset_does_not_affect_siblings
4 changes: 3 additions & 1 deletion features/list-elements.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,9 @@ spec:
- https://html.spec.whatwg.org/multipage/grouping-content.html#the-ol-element
- https://html.spec.whatwg.org/multipage/grouping-content.html#the-ul-element
- https://html.spec.whatwg.org/multipage/grouping-content.html#the-li-element
group: html-elements
group:
- html-elements
- lists
status:
compute_from:
- html.elements.ol
Expand Down
118 changes: 118 additions & 0 deletions features/list-style.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
name: List style
description: The `list-style` shorthand CSS property and the `list-style-image`, `list-style-position`, and `list-style-type` longhand properties set the position and appearance of a list item's marker.
spec: https://drafts.csswg.org/css-lists-3/#list-style-property
group: lists
status:
compute_from: css.properties.list-style
compat_features:
- css.properties.list-style
- css.properties.list-style-image
- css.properties.list-style-image.none
- css.properties.list-style-position
- css.properties.list-style-position.inside
- css.properties.list-style-position.outside
- css.properties.list-style-type
- css.properties.list-style-type.arabic-indic
- css.properties.list-style-type.armenian
- css.properties.list-style-type.bengali
- css.properties.list-style-type.cambodian
- css.properties.list-style-type.circle
- css.properties.list-style-type.cjk-decimal
- css.properties.list-style-type.cjk-earthly-branch
- css.properties.list-style-type.cjk-heavenly-stem
- css.properties.list-style-type.decimal
- css.properties.list-style-type.decimal-leading-zero
- css.properties.list-style-type.devanagari
- css.properties.list-style-type.disc
- css.properties.list-style-type.disclosure-closed
- css.properties.list-style-type.disclosure-open
- css.properties.list-style-type.ethiopic-numeric
- css.properties.list-style-type.georgian
- css.properties.list-style-type.gujarati
- css.properties.list-style-type.gurmukhi
- css.properties.list-style-type.hebrew
- css.properties.list-style-type.hiragana
- css.properties.list-style-type.hiragana-iroha
- css.properties.list-style-type.japanese-formal
- css.properties.list-style-type.japanese-informal
- css.properties.list-style-type.kannada
- css.properties.list-style-type.katakana
- css.properties.list-style-type.katakana-iroha
- css.properties.list-style-type.khmer
- css.properties.list-style-type.korean-hangul-formal
- css.properties.list-style-type.korean-hanja-formal
- css.properties.list-style-type.korean-hanja-informal
- css.properties.list-style-type.lao
- css.properties.list-style-type.lower-alpha
- css.properties.list-style-type.lower-armenian
- css.properties.list-style-type.lower-greek
- css.properties.list-style-type.lower-latin
- css.properties.list-style-type.lower-roman
- css.properties.list-style-type.malayalam
- css.properties.list-style-type.mongolian
- css.properties.list-style-type.myanmar
- css.properties.list-style-type.none
- css.properties.list-style-type.oriya
- css.properties.list-style-type.persian
- css.properties.list-style-type.simp-chinese-formal
- css.properties.list-style-type.simp-chinese-informal
- css.properties.list-style-type.square
- css.properties.list-style-type.string
- css.properties.list-style-type.symbols
- css.properties.list-style-type.tamil
- css.properties.list-style-type.telugu
- css.properties.list-style-type.thai
- css.properties.list-style-type.tibetan
- css.properties.list-style-type.trad-chinese-formal
- css.properties.list-style-type.trad-chinese-informal
- css.properties.list-style-type.upper-alpha
- css.properties.list-style-type.upper-armenian
- css.properties.list-style-type.upper-latin
- css.properties.list-style-type.upper-roman
- css.properties.list-style.symbols

# These keys are not in the spec and will need to be revisited.
# See https://github.com/web-platform-dx/web-features/issues/1862

# - css.properties.list-style-type.afar
# - css.properties.list-style-type.amharic
# - css.properties.list-style-type.amharic-abegede
# - css.properties.list-style-type.asterisks
# - css.properties.list-style-type.binary
# - css.properties.list-style-type.cjk-ideographic
# - css.properties.list-style-type.ethiopic
# - css.properties.list-style-type.ethiopic-abegede
# - css.properties.list-style-type.ethiopic-abegede-am-et
# - css.properties.list-style-type.ethiopic-abegede-gez
# - css.properties.list-style-type.ethiopic-abegede-ti-er
# - css.properties.list-style-type.ethiopic-abegede-ti-et
# - css.properties.list-style-type.ethiopic-halehame
# - css.properties.list-style-type.ethiopic-halehame-aa-er
# - css.properties.list-style-type.ethiopic-halehame-aa-et
# - css.properties.list-style-type.ethiopic-halehame-am
# - css.properties.list-style-type.ethiopic-halehame-am-et
# - css.properties.list-style-type.ethiopic-halehame-gez
# - css.properties.list-style-type.ethiopic-halehame-om-et
# - css.properties.list-style-type.ethiopic-halehame-sid-et
# - css.properties.list-style-type.ethiopic-halehame-so-et
# - css.properties.list-style-type.ethiopic-halehame-ti-er
# - css.properties.list-style-type.ethiopic-halehame-ti-et
# - css.properties.list-style-type.ethiopic-halehame-tig
# - css.properties.list-style-type.footnotes
# - css.properties.list-style-type.hangul
# - css.properties.list-style-type.hangul-consonant
# - css.properties.list-style-type.lower-hexadecimal
# - css.properties.list-style-type.lower-norwegian
# - css.properties.list-style-type.octal
# - css.properties.list-style-type.oromo
# - css.properties.list-style-type.sidama
# - css.properties.list-style-type.somali
# - css.properties.list-style-type.tigre
# - css.properties.list-style-type.tigrinya-er
# - css.properties.list-style-type.tigrinya-er-abegede
# - css.properties.list-style-type.tigrinya-et
# - css.properties.list-style-type.tigrinya-et-abegede
# - css.properties.list-style-type.upper-greek
# - css.properties.list-style-type.upper-hexadecimal
# - css.properties.list-style-type.upper-norwegian
# - css.properties.list-style-type.urdu
Loading