Add css3-syntax.vim

See also: http://www.w3.org/TR/css3-syntax/

after/syntax/css/css-backgrounds-4.vim

@@ -0,0 +1,7 @@
+syn keyword cssFontProp contained corners
+syn match cssFontProp contained "\<background-position-\(x\|y\|inline\|block\)\>"
+syn match cssFontProp contained "\<corner-shape\>"
+syn match cssFontProp contained "\<border-limit\>"
+syn match cssFontProp contained "\<border-clip\(-\(top\|right\|bottom\|left\)\)\=\>"
+syn keyword cssFontAttr contained bevel scoop notch
+syn match cssFontAttr contained "\<\(x\|y\)-\(start\|end\)\>"

after/syntax/css/css-device-adapt.vim

@@ -0,0 +1,2 @@
+syn match cssFontProp contained "\<\(min\|max\|user\)-zoom\>"
+syn region cssInclude start=/@viewport\>/ end=/\ze{/ skipwhite skipnl contains=css.*Prop,css.*Attr,cssValueInteger,cssValueLength,cssMediaKeyword,cssVendor,cssIncludeKeyword,cssComment nextgroup=cssMediaBlock

after/syntax/css/css-font-loading-3.vim

@@ -0,0 +1 @@
+" N/A

after/syntax/css/css3-syntax.vim

@@ -0,0 +1 @@
+" N/A

after/syntax/css/cssom.vim

@@ -0,0 +1 @@
+" N/A

after/syntax/css/filter-effects.vim

@@ -0,0 +1,4 @@
+syn match cssFontProp contained "\<flood-\(color\|opacity\)\>"
+syn match cssFontProp contained "\<color-interpolation-filters\>"
+syn match cssFontProp contained "\<lighting-color\>"
+syn keyword cssFontAttr sRGB linearRGB

after/syntax/css/geometry-1.vim

@@ -0,0 +1 @@
+" N/A

after/syntax/css/motion-1.vim

@@ -0,0 +1,2 @@
+syn match cssFontProp contained "\<motion\(-\(path\|offset\|rotation\)\)\=\>"
+syn region cssFunction contained matchgroup=cssFunctionName start="\<path\s*(" end=")" oneline keepend

after/syntax/css/selectors-nonelement-1.vim

@@ -0,0 +1 @@
+syn region cssPseudoClassLang matchgroup=cssPseudoClassId start="::attr(" end=")" oneline

after/syntax/css/web-animations.vim

@@ -0,0 +1 @@
+" N/A

after/syntax/html.vim

@@ -1,36 +1,19 @@
 syn include @htmlCss syntax/css/compositing-1.vim
-syn include @htmlCss syntax/css/css3-animations.vim
-syn include @htmlCss syntax/css/css3-background.vim
-syn include @htmlCss syntax/css/css3-box.vim
-syn include @htmlCss syntax/css/css3-break.vim
-syn include @htmlCss syntax/css/css3-colors.vim
-syn include @htmlCss syntax/css/css3-conditional.vim
-syn include @htmlCss syntax/css/css3-content.vim
-syn include @htmlCss syntax/css/css3-exclusions.vim
-syn include @htmlCss syntax/css/css3-fonts.vim
-syn include @htmlCss syntax/css/css3-images.vim
-syn include @htmlCss syntax/css/css3-multicol.vim
-syn include @htmlCss syntax/css/css3-page.vim
-syn include @htmlCss syntax/css/css3-positioning.vim
-syn include @htmlCss syntax/css/css3-regions.vim
-syn include @htmlCss syntax/css/css3-selectors.vim
-syn include @htmlCss syntax/css/css3-sizing.vim
-syn include @htmlCss syntax/css/css3-speech.vim
-syn include @htmlCss syntax/css/css3-transforms.vim
-syn include @htmlCss syntax/css/css3-transitions.vim
 syn include @htmlCss syntax/css/css-align-3.vim
+syn include @htmlCss syntax/css/css-backgrounds-4.vim
 syn include @htmlCss syntax/css/css-cascade-3.vim
 syn include @htmlCss syntax/css/css-cascade-4.vim
 syn include @htmlCss syntax/css/css-counter-styles-3.vim
+syn include @htmlCss syntax/css/css-device-adapt.vim
 syn include @htmlCss syntax/css/css-display-3.vim
 syn include @htmlCss syntax/css/css-flexbox-1.vim
+syn include @htmlCss syntax/css/css-font-loading-3.vim
 syn include @htmlCss syntax/css/css-gcpm-3.vim
 syn include @htmlCss syntax/css/css-grid-1.vim
 syn include @htmlCss syntax/css/css-inline-3.vim
 syn include @htmlCss syntax/css/css-line-grid-1.vim
 syn include @htmlCss syntax/css/css-lists-3.vim
 syn include @htmlCss syntax/css/css-masking-1.vim
-syn include @htmlCss syntax/css/cssom-view.vim
 syn include @htmlCss syntax/css/css-overflow-3.vim
 syn include @htmlCss syntax/css/css-page-floats-3.vim
 syn include @htmlCss syntax/css/css-pseudo-4.vim
@@ -48,5 +31,32 @@ syn include @htmlCss syntax/css/css-values.vim
 syn include @htmlCss syntax/css/css-variables.vim
 syn include @htmlCss syntax/css/css-will-change-1.vim
 syn include @htmlCss syntax/css/css-writing-modes-3.vim
+syn include @htmlCss syntax/css/css3-animations.vim
+syn include @htmlCss syntax/css/css3-background.vim
+syn include @htmlCss syntax/css/css3-box.vim
+syn include @htmlCss syntax/css/css3-break.vim
+syn include @htmlCss syntax/css/css3-colors.vim
+syn include @htmlCss syntax/css/css3-conditional.vim
+syn include @htmlCss syntax/css/css3-content.vim
+syn include @htmlCss syntax/css/css3-exclusions.vim
+syn include @htmlCss syntax/css/css3-fonts.vim
+syn include @htmlCss syntax/css/css3-images.vim
+syn include @htmlCss syntax/css/css3-multicol.vim
+syn include @htmlCss syntax/css/css3-page.vim
+syn include @htmlCss syntax/css/css3-positioning.vim
+syn include @htmlCss syntax/css/css3-regions.vim
+syn include @htmlCss syntax/css/css3-selectors.vim
+syn include @htmlCss syntax/css/css3-sizing.vim
+syn include @htmlCss syntax/css/css3-speech.vim
+syn include @htmlCss syntax/css/css3-syntax.vim
+syn include @htmlCss syntax/css/css3-transforms.vim
+syn include @htmlCss syntax/css/css3-transitions.vim
+syn include @htmlCss syntax/css/cssom-view.vim
+syn include @htmlCss syntax/css/cssom.vim
+syn include @htmlCss syntax/css/filter-effects.vim
+syn include @htmlCss syntax/css/geometry-1.vim
 syn include @htmlCss syntax/css/html5-elements.vim
+syn include @htmlCss syntax/css/motion-1.vim
+syn include @htmlCss syntax/css/selectors-nonelement-1.vim
 syn include @htmlCss syntax/css/selectors4.vim
+syn include @htmlCss syntax/css/web-animations.vim

test/test.css

@@ -40,6 +40,21 @@
   box-shadow: auto;
 }
 
+.background-4 {
+  background-position-x: x-start;
+  background-position-y: x-end;
+  background-position-inline: y-start;
+  background-position-block: y-end;
+  corner-shape: bevel;
+  corners: scoop;
+  border-limit: notch;
+  border-clip: auto;
+  border-clip-top: auto;
+  border-clip-right: auto;
+  border-clip-bottom: auto;
+  border-clip-left: auto;
+}
+
 .box {
   overflow-style: scrollbar;
   overflow-x: panner;
@@ -166,6 +181,10 @@
   display: smooth;
 }
 
+.cssom {
+  display: auto;
+}
+
 .display {
   box-suppress: flow;
   display: flow-root;
@@ -179,6 +198,13 @@
   wrap-through: maximum;
 }
 
+.filter-effects {
+  flood-color: sRGB;
+  flood-opacity: linearRGB;
+  color-interpolation-filters: auto;
+  lighting-color: auto;
+}
+
 .flexbox {
   flex-direction: flex;
   flex-wrap: inline-flex;
@@ -190,6 +216,10 @@
   flex-basis: main-size;
 }
 
+.font-loading-3 {
+  display: auto;
+}
+
 .fonts {
   font-feature-settings: common-ligatures;
   font-kerning: no-common-ligatures;
@@ -243,6 +273,10 @@
   display: closed;
 }
 
+.geometry-1 {
+  display: auto;
+}
+
 .grid {
   grid-template-columns: grid;
   grid-template-rows: inline-grid;
@@ -323,6 +357,13 @@
   mask-type: auto;
 }
 
+.motion-1 {
+  motion-path: path(M 100 100 L 300 100 L 200 300 z);
+  motion-offset: auto;
+  motion-rotation: auto;
+  motion: auto;
+}
+
 .multicol {
   columns: column;
   column-count: balance;
@@ -467,6 +508,10 @@
   display: auto;
 }
 
+.selectors-nonelement-1::attr(title) {
+  display: auto;
+}
+
 .shapes {
   shape-outside: margin-box;
   shape-image-threshold: inset(50% 50% 50% 50%);
@@ -508,6 +553,10 @@
   display: reduced;
 }
 
+.syntax {
+  display: auto;
+}
+
 .text-3 {
   hyphens: manual;
   line-break: loose;
@@ -623,6 +672,16 @@
   var-foo: var(foo);
 }
 
+@viewport {
+  min-zoom: auto;
+  max-zoom: auto;
+  user-zoom: auto;
+}
+
+.web-animations {
+  display: auto;
+}
+
 .will-change {
   will-change: scroll-position;
 }

test/test.html

@@ -53,6 +53,22 @@
 }
 </style>
 <style>
+.background-4 {
+  background-position-x: x-start;
+  background-position-y: x-end;
+  background-position-inline: y-start;
+  background-position-block: y-end;
+  corner-shape: bevel;
+  corners: scoop;
+  border-limit: notch;
+  border-clip: auto;
+  border-clip-top: auto;
+  border-clip-right: auto;
+  border-clip-bottom: auto;
+  border-clip-left: auto;
+}
+</style>
+<style>
 .box {
   overflow-style: scrollbar;
   overflow-x: panner;
@@ -190,6 +206,11 @@
 }
 </style>
 <style>
+.cssom {
+  display: auto;
+}
+</style>
+<style>
 .display {
   box-suppress: flow;
   display: flow-root;
@@ -205,6 +226,14 @@
 }
 </style>
 <style>
+.filter-effects {
+  flood-color: sRGB;
+  flood-opacity: linearRGB;
+  color-interpolation-filters: auto;
+  lighting-color: auto;
+}
+</style>
+<style>
 .flexbox {
   flex-direction: flex;
   flex-wrap: inline-flex;
@@ -217,6 +246,11 @@
 }
 </style>
 <style>
+.font-loading-3 {
+  display: auto;
+}
+</style>
+<style>
 .fonts {
   font-feature-settings: common-ligatures;
   font-kerning: no-common-ligatures;
@@ -272,6 +306,11 @@
 }
 </style>
 <style>
+.geometry-1 {
+  display: auto;
+}
+</style>
+<style>
 .grid {
   grid-template-columns: grid;
   grid-template-rows: inline-grid;
@@ -356,6 +395,14 @@
 }
 </style>
 <style>
+.motion-1 {
+  motion-path: path(M 100 100 L 300 100 L 200 300 z);
+  motion-offset: auto;
+  motion-rotation: auto;
+  motion: auto;
+}
+</style>
+<style>
 .multicol {
   columns: column;
   column-count: balance;
@@ -513,6 +560,11 @@
 }
 </style>
 <style>
+.selectors-nonelement-1::attr(title) {
+  display: auto;
+}
+</style>
+<style>
 .shapes {
   shape-outside: margin-box;
   shape-image-threshold: inset(50% 50% 50% 50%);
@@ -558,6 +610,11 @@
 }
 </style>
 <style>
+.syntax {
+  display: auto;
+}
+</style>
+<style>
 .text-3 {
   hyphens: manual;
   line-break: loose;
@@ -682,6 +739,18 @@
 }
 </style>
 <style>
+@viewport {
+  min-zoom: auto;
+  max-zoom: auto;
+  user-zoom: auto;
+}
+</style>
+<style>
+.web-animations {
+  display: auto;
+}
+</style>
+<style>
 .will-change {
   will-change: scroll-position;
 }