Adds support for nested CSS and color rebeccapurple #2150
+166
−3
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Improves CSS lexer to correctly highlight nested CSS rules, including those using parent selector references (&), pseudo-classes, and within media queries. This enhancement provides more accurate syntax highlighting for modern CSS practices, specifically addressing nested structures.
Consolidates CSS lexer specs, improving organization and readability. Removes redundant test files and cleans up visual samples.
Refactors the CSS nesting example for better readability and conciseness by removing unnecessary styles.
Updates the lexer's list of recognized CSS color keywords to include "rebeccapurple".
Author
|
Found a bunch of edge cases this doesn't support yet... I've marked the PR as draft until I've figured out how to add support for those. The current version of the lexer doesn't recognise ul {
li::marker {
color: royalblue;
}
li:nth-child(2n)::marker {
color: crimson;
}
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR adds support for CSS nesting, which has had baseline support across all major browsers since 2023 (https://caniuse.com/css-nesting) but doesn't seem to be supported in rouge yet.
The first pass at this was written using Copilot with Claude Sonnet 4, which got the selector syntax and the actual lexer rule pretty much spot-on; I've moved a few things around, cleaned up a bunch of extraneous test code, fixed up the quote style and indentation and verified it using the
rackupvisualiser.I've also added
rebeccapurpleto the list of CSS colors (https://drafts.csswg.org/css-color/#valdef-color-rebeccapurple)