mirror of
https://github.com/hail2u/vim-css3-syntax.git
synced 2025-12-07 03:04:26 +08:00
Add css-images-4.vim
See also: http://www.w3.org/TR/2017/WD-css-images-4-20170413/ This commit also moves some properties and functions from `css3-images.vim`.
This commit is contained in:
2
after/syntax/css/css-images-4.vim
Normal file
2
after/syntax/css/css-images-4.vim
Normal file
@@ -0,0 +1,2 @@
|
||||
syn match cssFontProp contained "\<image-resolution\>"
|
||||
syn region cssFunction contained matchgroup=cssFunctionName start="\<\(image\|element\|conic-gradient\)\s*(" end=")" oneline keepend
|
||||
@@ -1,7 +1,6 @@
|
||||
" TODO: create cssImagesProp group and cssImagesAttr group
|
||||
syn match cssFontProp contained "\<object-\(fit\|position\)\>"
|
||||
syn match cssFontProp contained "\<image-\(resolution\|orientation\)\>"
|
||||
syn match cssFontProp contained "\<image-orientation\>"
|
||||
syn keyword cssFontAttr contained contain cover snap
|
||||
syn match cssFontAttr contained "\<from-image\>"
|
||||
syn match cssFontAttr contained "\<scale-down\>"
|
||||
syn region cssFunction contained matchgroup=cssFunctionName start="\<\(image\|\(repeating-\)\=\(linear\|radial\)-gradient\)\s*(" end=")" oneline keepend
|
||||
syn region cssFunction contained matchgroup=cssFunctionName start="\<\(\(repeating-\)\=\(linear\|radial\)-gradient\)\s*(" end=")" oneline keepend
|
||||
|
||||
@@ -16,6 +16,7 @@ syn include @htmlCss syntax/css/css-fonts-3.vim
|
||||
syn include @htmlCss syntax/css/css-fonts-4.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-images-4.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
|
||||
|
||||
@@ -363,19 +363,24 @@
|
||||
grid-gap: auto;
|
||||
}
|
||||
|
||||
.images {
|
||||
.images-3 {
|
||||
object-fit: contain;
|
||||
object-position: cover;
|
||||
image-resolution: snap;
|
||||
image-orientation: scale-down;
|
||||
image-orientation: snap;
|
||||
display: scale-down;
|
||||
display: from-image;
|
||||
display: image("sprite.svg#xywh=40,0,20,20");
|
||||
display: linear-gradient(to bottom, yellow, blue);
|
||||
display: radial-gradient(farthest-corner at 50% 50%, yellow, green);
|
||||
display: repeating-linear-gradient(to bottom, yellow, blue);
|
||||
display: repeating-radial-gradient(farthest-corner at 50% 50%, yellow, green);
|
||||
}
|
||||
|
||||
.images-4 {
|
||||
image-resolution: image("sprite.svg#xywh=40,0,20,20");
|
||||
display: element(#test);
|
||||
display: conic-gradient(at 25% 30%, white, black 60%);
|
||||
}
|
||||
|
||||
.inline-3 {
|
||||
dominant-baseline: mathematical;
|
||||
alignment-baseline: ideographic;
|
||||
|
||||
@@ -404,10 +404,9 @@
|
||||
.images {
|
||||
object-fit: contain;
|
||||
object-position: cover;
|
||||
image-resolution: snap;
|
||||
image-orientation: scale-down;
|
||||
image-orientation: snap;
|
||||
display: scale-down;
|
||||
display: from-image;
|
||||
display: image("sprite.svg#xywh=40,0,20,20");
|
||||
display: linear-gradient(to bottom, yellow, blue);
|
||||
display: radial-gradient(farthest-corner at 50% 50%, yellow, green);
|
||||
display: repeating-linear-gradient(to bottom, yellow, blue);
|
||||
@@ -415,6 +414,13 @@
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.images-4 {
|
||||
image-resolution: image("sprite.svg#xywh=40,0,20,20");
|
||||
display: element(#test);
|
||||
display: conic-gradient(at 25% 30%, white, black 60%);
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.inline-3 {
|
||||
dominant-baseline: mathematical;
|
||||
alignment-baseline: ideographic;
|
||||
|
||||
Reference in New Issue
Block a user