How to make scopes with different settings in settings.json file | VSCode? - json

Question

I want to change colors of my color theme in VSCode and I got stuck with scope and settings properties in settings.json file.
"[Palenight Theme]": {
"textMateRules": [
{
"scope": ["string.quoted.double.html",
"meta.attribute.content.html",
"meta.tag.metadata.meta.void.html",
"text.html.derivative",
],
"settings": {
"foreground": "#bcb9ff",
},
}
],
}
I tried to add another scope and settings properties but it doesn't work, it completely overrides the first one even though it contains completely different properties.
"[Palenight Theme]": {
"textMateRules": [
{
"scope": ["string.quoted.double.html",
"meta.attribute.content.html",
"meta.tag.metadata.meta.void.html",
"text.html.derivative",
],
"settings": {
"foreground": "#bcb9ff",
},
//Completely overrides the first one.
"scope": ["entity.name.tag.html",],
"settings": {
"foreground": "#fff",
},
}
],
}
How can I achieve this?

Answer 1

As #rivo8 said, instead of adding properties to the body of the first object, you should add a new object the the "textMateRules" array, basically doing it like this:
"[Palenight Theme]": {
"textMateRules": [
{
"scope": ["string.quoted.double.html",
"meta.attribute.content.html",
"meta.tag.metadata.meta.void.html",
"text.html.derivative",
],
"settings": {
"foreground": "#bcb9ff",
},
},
{
//Completely overrides the first one.
"scope": ["entity.name.tag.html",],
"settings": {
"foreground": "#fff",
},
},
],
}