Custom Scope Names
July 31, 2024 ยท View on GitHub
This file aims to be used as a way to point out the extra-matched scopes for themes to be able to support them.
This extension also has support for specific themes when enabling custom colors customization, and as a fallback, it tries to generate a color-pallete based on the current theme. For the list of supported themes, please refer to supported themes.
Summary
- Custom Scope Names
- General
- Angular
- PrimeNG
- NG Bootstrap
- Kendo UI
- HTML
- SVG
- XML
- Style tags
- Script tags
- Link tags
General
Element differentiation (HTML/SVG/Custom/Angular)
- custom-component -
html-template.tag.custom - div -
html-template.tag.html - mat-accordion -
entity.name.tag.html.ng - svg -
html-template.tag.svg
Angular
Directives
- General
=- punctuation.separator.key-value.html-template.ng
[binding][- punctuation.definition.ng-binding-name.begin.htmlbinding- html-template.ng.attributes.input-binding.first-level]- punctuation.definition.ng-binding-name.end.html
@animationTrigger@- html-template.ng.attributes.animationtrigger.prefixanimationTrigger- html-template.ng.attributes.animationtrigger.variable
(click)(- punctuation.definition.ng-binding-name.begin.htmlclick- html-template.ng.attributes.event-handler)- punctuation.definition.ng-binding-name.end.html
[(binding)][(- punctuation.definition.ng-binding-name.begin.htmlbinding- html-template.ng.attributes.input-binding.first-level)]- punctuation.definition.ng-binding-name.end.html
[(binding)][(- punctuation.definition.ng-binding-name.begin.htmlbinding- html-template.ng.attributes.input-binding.first-level)]- punctuation.definition.ng-binding-name.end.html
[style.font-size.px][- punctuation.definition.ng-binding-name.begin.htmlstyle- html-template.ng.attributes.input-binding.first-levelfont-size- html-template.ng.attributes.input-binding.second-levelpx- html-template.ng.attributes.input-binding.third-level]- punctuation.definition.ng-binding-name.end.html
[@visibility][- punctuation.definition.ng-binding-name.begin.html@- html-template.ng.attributes.input-binding.animationTrigger.prefixvisibility- html-template.ng.attributes.input-binding.first-level]- punctuation.definition.ng-binding-name.end.html
*ngFor*- html-template.ng.attributes.prefix.sugarngFor- html-template.ng.attributes.suffix.sugar
ref-assignVariable$ref-- html-template.ng.attributes.prefix.refassignVariable- html-template.ng.attributes.suffix.name$- html-template.ng.attributes.suffix.rxjs
let-col$let-- html-template.ng.attributes.prefix.letcol- html-template.ng.attributes.suffix.name$- html-template.ng.attributes.suffix.rxjs
#templateVariable#- html-template.ng.attributes.template.prefixtemplateVariable- html-template.ng.attributes.template.variable`
Interpolations
{{- html-template.ng.interpolation.begin|,||,&&- html-template.ng.expression.operator.logical.,?.,!.- html-template.ng.expression.operator.navigator+,-,/,*,%- html-template.ng.expression.operator.arithmetic==,===- html-template.ng.expression.operator.comparison?,:- html-template.ng.expression.operator.navigator??,&- html-template.ng.expression.operator.bitwise}}- html-template.ng.interpolation.end
Control Flow
@- html-template.ng.control-flow.prefixfor,switch,if,[...]- html-template.ng.control-flow.keyword
PrimeNG
p-calendar- entity.name.tag.html.primeng
NG Bootstrap
ngb-toast- entity.name.tag.html.ng-bootstrap
Kendo UI
kendo-editor- entity.name.tag.html.kendo
HTML
Doctype
!- html-template.ng.exclamation.doctypeDOCTYPE- html-template.ng.doctypehtml- html-template.ng.attribute.doctype
Entities
&- html-template.ng.entities.ampersand;- html-template.ng.entities.semicolon
DOM events
onabort- html-template.ng.attributes.events
Generic attributes
class- html-template.ng.attributes.generic
ARIA attributes
aria-- html-template.ng.aria-attribute.prefixsort- html-template.ng.aria-attribute.suffix
Data attributes
data-- html-template.ng.data-attribute.prefixtest- html-template.ng.data-attribute.suffix
SVG
Non-string attributes
M202.35,163.64l-4.38-13.1h-2.13v-3.85h9.1v3.85h-1.82l2.05z" -html-template.ng.svg.path.commands
XML
DTD, elements and attributes namespace
DTD
<!ELEMENT DAY (DATE,(HOLIDAY|PROGRAMSLOT+)+)>!- html-template.ng.exclamation.dtdELEMENT- html-template.ng.dtdDAY- html-template.ng.attribute.doctypeHOLIDAY- html-template.ng.qualifier.dtd|,+,?,*- html-template.ng.occurrence.dtd
<!ELEMENT BANNER (#PCDATA)>#PCDATA- constant.language.dtd
Element Namespace
<li:book>:- html-template.ng.tag.colonbook- html-template.ng.tag.suffix
Attribute Namespace
xmlns:list="listurl":- html-template.ng.attributes.colonlist- html-template.ng.attributes.suffix
Stylesheet
- ``type="text/xls"`
xls- html-template.ng.xmlStylesheet.language.identifier
Style tags
type="text/css"css- html-template.ng.style.language.identifier
lang="css"css- html-template.ng.style.language.identifier
Script tags
type="text/javascript"javascript- html-template.ng.script.language.identifier
lang="javascript"javascript- html-template.ng.script.language.identifier
Link tags
type="image/x-icon"x-icon- html-template.ng.link.myme-type