AdguardTeam / VscodeAdblockSyntax

Comprehensive extension to manage Adblock Syntax in VSCode: syntax highlighter, linter and much more. Available on the VSCode Marketplace.
https://marketplace.visualstudio.com/items?itemName=adguard.adblock
MIT License
70 stars 8 forks source link

[GitHub Linguist] `@media` rules? #56

Closed krystian3w closed 1 year ago

krystian3w commented 1 year ago

In AdGuard Filters maybe all usage was removed - maybe as outdated (or I can not remember files with ~13 rules).

I see these is now invalid at end:

rootblog.pl#$#@media all and (min-width: 1200px) { a[href*="news.google.com/publications/"] { visibility: hidden !important; } }

rootblog.pl#$#@media (min-width: 1200px) { a[href*="news.google.com/publications/"] { visibility: hidden !important; } }
rootblog.pl#$#@media all and (min-width: 1200px) { a[href*="news.google.com/publications/"] b { content: "Chcesz być na bieżąco?..." !important; font-weight: bold; position: absolute; left: 19%; color: var(--cs-color-site-background); background: var(--cs-color-site-background); visibility: visible !important; } }

rootblog.pl#$#@media (min-width: 1200px) { a[href*="news.google.com/publications/"] b { content: "Chcesz być na bieżąco?..." !important; font-weight: bold; position: absolute; left: 19%; color: var(--cs-color-site-background); background: var(--cs-color-site-background); visibility: visible !important; } }

In uBo run only as:

rootblog.pl##a[href*="news.google.com/publications/"]:matches-media((min-width: 1200px)):style(visibility: hidden !important;)

rootblog.pl##a[href*="news.google.com/publications/"] b::after:matches-media((min-width: 1200px)):style(content: "Chcesz być na bieżąco?..." !important; font-weight: bold; position: absolute; left: 19%; color: var(--cs-color-site-background); background: var(--cs-color-site-background); visibility: visible !important;)

Filters is useful for articles on rootblog.pl to hide nasty Google news promotion. For now only covered wide PC.

(I don't see opened issue in FiltersCompiler about this parole by gorhill - still rejected will be "key frames" or "supports")

krystian3w commented 1 year ago

Maybe should fixed by #50 if cover GitHub.

scripthunter7 commented 1 year ago

The final solution will probably be given by PR https://github.com/ameshkov/VscodeAdblockSyntax/pull/50, as you write, since a new CSS highlighter will be introduced there. The current "problem" with this PR is that the TM language source should be converted to YAML so that it is more maintainable, and it is also necessary to introduce tokenization unit tests, since quite a lot is covered.

This issue caused by cssStyle:

https://github.com/ameshkov/VscodeAdblockSyntax/blob/2261166ff85aaa724353710da164231edfe82fc9/syntaxes/adblock.tmLanguage.json#L920-L944

The regex should be modified to handle the media query as well.

scripthunter7 commented 1 year ago

@krystian3w @Alex-302 Please try the temporary fix here

Commit reference: https://github.com/scripthunter7/VscodeAdblockSyntax/commit/b815876ad1e0c1b5e45d0c37f6cb02401bb12674

Please note that after its merged, Github's highlighter will not take effect, as it only receives new grammars during the Linguist relese (approximately every quarter)

scripthunter7 commented 1 year ago

@krystian3w It seems that the new version has been uploaded to GitHub, but it will take some time before it will work properly everywhere:

#$#@media (a: b) { .selector { a: b; } }