ecmel/vscode-html-css

Nested selectors highlighting

Closed this issue · 10 comments

The scopes entity.name.tag.css and meta.selector.css are missing when a nested selector is used. This problem extends to pseudo-classes and property names.

image image

image

image

System information

HTML CSS Support: v1.13.1

Version: 1.85.1
Commit: 0ee08df0cf4527e40edc9aa28f4b5bd38bbff2b2
Date: 2023-12-13T09:47:11.635Z
Electron: 25.9.7
ElectronBuildId: 25551756
Chromium: 114.0.5735.289
Node.js: 18.15.0
V8: 11.4.183.29-electron.0
OS: Linux x64 6.5.0-14-generic

This extension does not do any highlighting for CSS. It completes class and id attributes in html.

Isn't the lack of highlighting due to the lack of provided scopes? I doesn't provide autocomplete in these cases as well.

Please try version 2.0.0

The issue continues as described, the nested selector h2 has the same scope as in the other screenshot.

image

System information:

HTML CSS Support: v2.0.0
Version: 1.85.1
Commit: 0ee08df0cf4527e40edc9aa28f4b5bd38bbff2b2
Date: 2023-12-13T09:47:11.635Z
Electron: 25.9.7
ElectronBuildId: 25551756
Chromium: 114.0.5735.289
Node.js: 18.15.0
V8: 11.4.183.29-electron.0
OS: Linux x64 6.5.0-14-generic

There are no class or id selector in your screenshots.

I'm aware, the original issue is about the selectors (h2, :hover) themselves not having any highlight, since they are more important to me than a property highlight (border-top-left-radius). In the screenshot below, you can see that the second h2 selector has the scope entity.name.tag.css, which is not present in the first.

image

I think this problem is not related with this extension. Which style selector are your trying to complete? Can you post the relevant css and completion code here

I'm not sure I understand. VS Code offers no valid autocomplete options for the selectors that aren't highlighted (h2 and :hover as well as many others when they are nested)

Extension only offers completion for class (.) and id (#) selectors.

I'm sorry, I thought this extension was responsible for providing scopes for CSS in VS Code. Thank you for the prompt replies.