HTML-CSS-Class-Completion icon indicating copy to clipboard operation
HTML-CSS-Class-Completion copied to clipboard

Support prefixed / non-standard class names

Open onetrev opened this issue 7 years ago • 2 comments

Currently the regex used for this extension -> const classNameRegex: RegExp = /[.]([\w-]+)/g; will only accept standard class name characters. However, you can (as of CSS 2.1) escape non-standard characters in your CSS. So hopefully support for this can be added. This is also applicable for anyone using TailwindCSS, but there are lots of other use cases for classes such as:

.md\:absolute .sm\:w-1\/2

Of course when you are autocompleting they need to show up sanitized, with the escape character removed so like so:

.md:absolute .sm:w-1/2

I've noticed this is supported in this extention I believe using the two functions at the bottom of this file.

onetrev avatar Jan 26 '18 03:01 onetrev

Is this the regexp that parses the class names? Maybe it just needs to be less restrictive.

https://github.com/zignd/HTML-CSS-Class-Completion/blob/master/src/parse-engines/common/css-class-extractor.ts#L9

skyrpex avatar Apr 10 '19 13:04 skyrpex

I have fixed this in my fork: https://github.com/LoranKloeze/HTML-CSS-Class-Completion-Reworked

LoranKloeze avatar Aug 03 '21 09:08 LoranKloeze