LESS if() function collides with CSS if() function
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 17k
- Forks
- 3.4k
- Avg merge
- 7h 42m
- Merged PRs (30d)
- 26
Description
To reproduce:
A property with an if() function using native CSS syntax in LESS space.
color: if(style(color: none): blue; else: red);
Current behavior:
Error: Could not parse call arguments or missing ')'
Expected behavior:
A possibility to use the native CSS if() function directly, without a hack: color: ~"if(style(color: none): blue; else: red);"
Environment information:
Used within Stylus browser extension.
lessversion: 4.4.2 (based on https://github.com/openstyles/stylus/blob/master/package.json)nodejsversion: unknownoperating system: any
Proposed solution:
Determine whether LESS parser should process if() function or pass it on, by its syntax.
LESS syntax: three parameters https://lesscss.org/functions/#logical-functions-if
native CSS syntax: one comma separated "parameter" https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/if#syntax
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the reported LESS snippet and inspect the parser handling of function calls, comparing native CSS if() syntax with LESS's three-parameter logical function. Done means the native CSS form parses without the escaping hack while existing LESS if() syntax continues to work, with regression coverage for both cases.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 52/100