Allow ignoring longhand background-image property

[adamaveray]

📒 Description

It is not uncommon to set a background property on a common selector, then multiple background-image properties on individual instances to use different images for a collection of items. For example:

.item {
  background: no-repeat 50% 50% / contain;
}

.item[data-item="one"] {
  background-image: url('one.svg');
}
.item[data-item="two"] {
  background-image: url('two.svg');
}
.item[data-item="three"] {
  background-image: url('three.svg');
}

The background-repeat rule is all-or-nothing, so in this use case one would be forced to disable the rule entirely or litter the stylesheet with ignore comments. It would be nice to allow validating only the shorthand background property while ignoring standalone longhand background-image properties.

🚀 Changes

• Adds new shorthand and longhand options to the background-repeat rule.

🔐 Closes

N/A

⛳️ Testing

• Added tests to cover the new functionality.
• Ran npm test to ensure the new functionality works as intended.