Skip to content

Commit

Permalink
CSS: Update ray() syntax and add values (#700)
Browse files Browse the repository at this point in the history
### Description

- Fixes #676 
To address listing the values for `<ray-size>`, I've referred to the
instructions in the `mdn/data/docs` section [Store the information in
the
JSONs](https://github.com/mdn/data/blob/main/docs/updating_css_json.md#store-the-information-in-the-jsons),
where it mentions how to handle when "syntax contains references to
specific values".
   
I've added `"syntaxes"` for `ray()` in `syntaxes.json`. I've included
only the keys that have further values. I'm not sure if that's the
correct way to do it though. I am assuming this should be okay because
the complete syntax exists in `functions.json`.

**UPDATE**: `"syntaxes"` is not supported, was getting lint errors. I've
reverted to use `syntax` but expanded the `<ray-size>` and `<position>`
values inline.

- I'm also using this PR to update `ray()` function syntax (mdn/content
PR to add [Formal
syntax](https://pr31514.content.dev.mdn.mozit.cloud/en-US/docs/Web/CSS/ray#formal_syntax)).
With Firefox122 coming out on Jan 23, 2024, `ray()` will be supported by
default, making it standard across browsers. So I've also updated the
status to `standard` (BCD PR with [ray() status
update](https://github.com/mdn/browser-compat-data/pull/21844/files#diff-5153a0172f96a72ece248c9d29cea659e3ecd45c45d81d57b0b6f2f00c57e7b3R98)).
### Motivation

Addressing an issue as well as updating the syntax

### Related issues and pull requests

mdn/browser-compat-data#21844
mdn/content#31514
  • Loading branch information
dipikabh authored Jan 6, 2024
1 parent 4475a2e commit 34ce070
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 3 deletions.
4 changes: 2 additions & 2 deletions css/functions.json
Original file line number Diff line number Diff line change
Expand Up @@ -326,11 +326,11 @@
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/gradient/radial-gradient"
},
"ray()": {
"syntax": "ray( <angle> && <ray-size>? && contain? )",
"syntax": "ray( <angle> && <ray-size>? && contain? && [at <position>]? )",
"groups": [
"CSS Motion Path"
],
"status": "experimental",
"status": "standard",
"mdn_url": "https://developer.mozilla.org/docs/Web/CSS/ray"
},
"repeating-linear-gradient()": {
Expand Down
2 changes: 1 addition & 1 deletion css/syntaxes.json
Original file line number Diff line number Diff line change
Expand Up @@ -621,7 +621,7 @@
"syntax": "<number [0,∞]> [ / <number [0,∞]> ]?"
},
"ray()": {
"syntax": "ray( <angle> && <ray-size>? && contain? )"
"syntax": "{ <angle> && [closest-side | closest-corner | farthest-side | farthest-corner | sides] && contain? && [at [ left | center | right | top | bottom | <length-percentage> ] | [ left | center | right ] && [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ] | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ]]"
},
"relative-selector": {
"syntax": "<combinator>? <complex-selector>"
Expand Down

0 comments on commit 34ce070

Please sign in to comment.