Summary
CSS @media rules contain feature queries (e.g., (min-width: 768px), (prefers-color-scheme: dark), (orientation: landscape)) that are not indexed. These query parameters are navigation anchors in responsive design workflows. Currently @media blocks themselves are indexed as "namespace", but the feature names and breakpoint values inside parentheses are invisible. Adding feature extraction would enable searches like "find all min-width usage" or "find dark mode styles".
Where
src/CodeIndex/Indexer/Symbols/SymbolExtractor.cs:1860 — CSS @media regex captures the opening but discards query detailssrc/CodeIndex/Indexer/Symbols/SymbolExtractor.Css.cs — No parsing of parenthesized feature expressions after @media keyword
Suggested approach
- Extract feature names (the identifiers and custom-property references inside
@media parentheses) as separate "property" or "class" symbols
- For example, parse
@media (min-width: 768px) and (prefers-color-scheme: dark) to yield symbols for min-width and prefers-color-scheme
- Handle boolean logic operators (
and, or, not) correctly
- Skip feature values (e.g.,
768px, dark) as they are literals, not identifiers
- Consider a separate symbol kind (e.g.,
"media-feature") if the distinction from regular properties is important for consumers
- Add tests for complex queries, operator precedence, and nesting inside
@supports blocks
Summary
CSS
@mediarules contain feature queries (e.g.,(min-width: 768px),(prefers-color-scheme: dark),(orientation: landscape)) that are not indexed. These query parameters are navigation anchors in responsive design workflows. Currently@mediablocks themselves are indexed as "namespace", but the feature names and breakpoint values inside parentheses are invisible. Adding feature extraction would enable searches like "find all min-width usage" or "find dark mode styles".Where
src/CodeIndex/Indexer/Symbols/SymbolExtractor.cs:1860— CSS@mediaregex captures the opening but discards query detailssrc/CodeIndex/Indexer/Symbols/SymbolExtractor.Css.cs— No parsing of parenthesized feature expressions after@mediakeywordSuggested approach
@mediaparentheses) as separate "property" or "class" symbols@media (min-width: 768px) and (prefers-color-scheme: dark)to yield symbols formin-widthandprefers-color-schemeand,or,not) correctly768px,dark) as they are literals, not identifiers"media-feature") if the distinction from regular properties is important for consumers@supportsblocks