Skip to content

Commit ba0a7aa

Browse files
committed
Add mix-blend-mode property
[Compositing and Blending Level 1](https://www.w3.org/TR/compositing-1/#mix-blend-mode)
1 parent 7433cb0 commit ba0a7aa

File tree

3 files changed

+33
-0
lines changed

3 files changed

+33
-0
lines changed

src/css/Properties.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -330,6 +330,7 @@ var Properties = module.exports = {
330330
"max-width" : "<length> | <percentage> | <content-sizing> | none",
331331
"min-height" : "<length> | <percentage> | <content-sizing> | contain-floats | -moz-contain-floats | -webkit-contain-floats",
332332
"min-width" : "<length> | <percentage> | <content-sizing> | contain-floats | -moz-contain-floats | -webkit-contain-floats",
333+
"mix-blend-mode" : "<blend-mode>",
333334
"move-to" : 1,
334335

335336
// N

src/css/ValidationTypes.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -329,6 +329,11 @@ copy(ValidationTypes, {
329329
"<bg-size>":
330330
"[ <length> | <percentage> | auto ]{1,2} | cover | contain",
331331

332+
"<blend-mode>":
333+
"normal | multiply | screen | overlay | darken | lighten | color-dodge | " +
334+
"color-burn | hard-light | soft-light | difference | exclusion | hue | " +
335+
"saturation | color | luminosity",
336+
332337
"<border-image-slice>":
333338
// [<number> | <percentage>]{1,4} && fill?
334339
// *but* fill can appear between any of the numbers

tests/css/Validation.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1114,6 +1114,33 @@ var YUITest = require("yuitest"),
11141114
}
11151115
}));
11161116

1117+
suite.add(new ValidationTestCase({
1118+
property: "mix-blend-mode",
1119+
1120+
valid: [
1121+
"normal",
1122+
"multiply",
1123+
"screen",
1124+
"overlay",
1125+
"darken",
1126+
"lighten",
1127+
"color-dodge",
1128+
"color-burn",
1129+
"hard-light",
1130+
"soft-light",
1131+
"difference",
1132+
"exclusion",
1133+
"hue",
1134+
"saturation",
1135+
"color",
1136+
"luminosity"
1137+
],
1138+
1139+
invalid: {
1140+
"foo" : "Expected (normal | multiply | screen | overlay | darken | lighten | color-dodge | color-burn | hard-light | soft-light | difference | exclusion | hue | saturation | color | luminosity) but found 'foo'."
1141+
}
1142+
}));
1143+
11171144
// test <paint>
11181145
suite.add(new ValidationTestCase({
11191146
property: "fill",

0 commit comments

Comments
 (0)