Skip to content

Commit c8269e3

Browse files
jacobcassidyjacobcassidy
committed
Move meta.ratio.css rule inside of #numeric-values scope
For use with `@container`, `@media`, and default `aspect-ratio` property values.
1 parent e519bfc commit c8269e3

File tree

4 files changed

+66
-47
lines changed

4 files changed

+66
-47
lines changed

‎demo/at-container-demo.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,7 @@
8989
container: sidebar / inline-size;
9090
}
9191

92-
@container (min-width: 400px) {
92+
@container (min-width: calc(400px * 4) ) {
9393
/* … */
9494
}
9595
@container (orientation: landscape) and (width > 400px) {

‎demo/keyword-delimiter.css

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,14 @@
44
font: 16px/1.5 'Helvetica Neue', sans-serif;
55
border-radius:50% / 30%;
66
box-shadow:10px 10px 5px rgba(0,0,0,0.5) / inset;
7+
box-shadow:10px 10px 5px rgba(0,0,0,0.5) / rgba(0,0,0,0.5) inset;
78
background:url("image.jpg") / cover;
89
grid:auto-flow dense / auto auto;
10+
aspect-ratio: 3 / 4;
11+
12+
@container (min-aspect-ratio: 3 / 2) {}
13+
14+
@media (min-aspect-ratio: 3 / 4) and (max-aspect-ratio: 20 / 17) {}
915
}
1016

1117
.invalid-delimiters {
@@ -29,7 +35,5 @@
2935

3036
@namespace pre "http://url/";
3137

32-
@media (min-aspect-ratio: 3 / 4) and (max-aspect-ratio: 20 / 17) {}
33-
3438
a{content: url (http://a.pl/)}
3539
}

‎src/vscode-css/grammars/css.cson

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1851,17 +1851,6 @@
18511851
'match': '>=|<=|=|<|>'
18521852
'name': 'keyword.operator.comparison.css'
18531853
}
1854-
{
1855-
'captures':
1856-
'1':
1857-
'name': 'constant.numeric.css'
1858-
'2':
1859-
'name': 'keyword.operator.arithmetic.css'
1860-
'3':
1861-
'name': 'constant.numeric.css'
1862-
'match': '(\\d+)\\s*(/)\\s*(\\d+)'
1863-
'name': 'meta.ratio.css'
1864-
}
18651854
{
18661855
'include': '#numeric-values'
18671856
}
@@ -1901,6 +1890,17 @@
19011890
'''
19021891
'numeric-values':
19031892
'patterns': [
1893+
{
1894+
'captures':
1895+
'1':
1896+
'name': 'constant.numeric.css'
1897+
'2':
1898+
'name': 'keyword.operator.arithmetic.css'
1899+
'3':
1900+
'name': 'constant.numeric.css'
1901+
'match': '(?<=aspect-ratio:.*)(\\d+)\\s*(/)\\s*(\\d+)'
1902+
'name': 'meta.ratio.css'
1903+
}
19041904
{
19051905
'captures':
19061906
'1':

‎syntaxes/css.tmLanguage.json

Lines changed: 48 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -223,7 +223,7 @@
223223
"name": "punctuation.definition.keyword.css"
224224
}
225225
},
226-
"end": "(?=\\s*($|[:{;]))",
226+
"end": "(?=\\s?(?=$|[:{;]))",
227227
"name": "meta.at-rule.page.css",
228228
"patterns": [
229229
{
@@ -784,6 +784,10 @@
784784
},
785785
"color-keywords": {
786786
"patterns": [
787+
{
788+
"match": "(?xi)\n(?<=\n (transition|transition-property)\n \\:[\\w\\s\\-,]*\n)\nbackground",
789+
"name": "support.constant.property-value.css"
790+
},
787791
{
788792
"match": "(?i)(?<![\\w-])(aqua|black|blue|fuchsia|gray|green|lime|maroon|navy|olive|orange|purple|red|silver|teal|white|yellow)(?![\\w-])",
789793
"name": "support.constant.color.w3c-standard-color-name.css"
@@ -797,7 +801,11 @@
797801
"name": "support.constant.color.current.css"
798802
},
799803
{
800-
"match": "(?xi) (?<![\\w-])\n(ActiveBorder|ActiveCaption|AppWorkspace|Background|ButtonFace|ButtonHighlight|ButtonShadow\n|ButtonText|CaptionText|GrayText|Highlight|HighlightText|InactiveBorder|InactiveCaption\n|InactiveCaptionText|InfoBackground|InfoText|Menu|MenuText|Scrollbar|ThreeDDarkShadow\n|ThreeDFace|ThreeDHighlight|ThreeDLightShadow|ThreeDShadow|Window|WindowFrame|WindowText)\n(?![\\w-])",
804+
"match": "(?xi) (?<![\\w-])\n(accentcolor|accentcolortext|activetext|buttonborder|buttonface|buttontext|canvas|canvastext|field|fieldtext\n|graytext|highlight|highlighttext|linktext|mark|marktext|selecteditem|selecteditemtext|visitedtext)\n(?![\\w-])",
805+
"name": "support.constant.color.system.css"
806+
},
807+
{
808+
"match": "(?xi) (?<![\\w-])\n(ActiveBorder|ActiveCaption|AppWorkspace|Background|ButtonHighlight|ButtonShadow|CaptionText\n|InactiveBorder|InactiveCaption|InactiveCaptionText|InfoBackground|InfoText|Menu|MenuText|Scrollbar\n|ThreeDDarkShadow|ThreeDFace|ThreeDHighlight|ThreeDLightShadow|ThreeDShadow|Window|WindowFrame|WindowText)\n(?![\\w-])",
801809
"name": "invalid.deprecated.color.system.css"
802810
}
803811
]
@@ -901,20 +909,13 @@
901909
{
902910
"include": "#container-query-features"
903911
},
904-
{
905-
"match": "(?xi)\n# Match a slash as a property value delimiter if it's not enclosed by parentheses\n(?:\n (?<!\\(:[^\\)]*)\n /\n)",
906-
"name": "meta.property-value.delimiter.css"
907-
},
908912
{
909913
"match": "(?xi)\n# Match must be preceded by one of the following:\n(?<=\n ^ # Start of line\n | \\s # Whitespace\n | \\( # Opening parenthesis\n | \\*/ # Comment closing\n)\n\n(?:\n # Standardised features\n (\n (?:\n min-\n | max-\n )?\n\n # Range features\n (?:\n aspect-ratio\n | block-size\n | height\n | inline-size\n | width\n )\n | orientation\n )\n)\n\n# Match must be followed by one of the following:\n(?=\n \\s # Whitespace\n | $ # End of line\n | [><:=] # Comparison operator\n | \\) # Closing parenthesis\n | /\\* # Comment opening\n)",
910914
"name": "support.type.property-name.container.css"
911915
},
912916
{
913917
"match": "(?xi)\n# Match must be preceded by one of the following:\n(?<=\n ^ # Start of line\n | \\s # Whitespace\n | : # Colon\n | \\*/ # Comment closing\n)\n\n# Orientation\n(?:\n portrait\n | landscape\n)\n\n# Match must be followed by one of the following:\n(?=\n \\s # Whitespace\n | \\) # Closing parenthesis\n | /\\* # Comment opening\n | $ # End of line\n)",
914918
"name": "support.constant.property-value.container.css"
915-
},
916-
{
917-
"include": "#functions"
918919
}
919920
]
920921
},
@@ -984,9 +985,6 @@
984985
"match": "(true|false)",
985986
"name": "support.constant.boolean.container.css"
986987
},
987-
{
988-
"include": "#functions"
989-
},
990988
{
991989
"include": "#property-keywords"
992990
},
@@ -1017,6 +1015,9 @@
10171015
},
10181016
{
10191017
"include": "#comment-block"
1018+
},
1019+
{
1020+
"include": "#functions"
10201021
}
10211022
]
10221023
},
@@ -1027,7 +1028,7 @@
10271028
"name": "constant.character.escape.codepoint.css"
10281029
},
10291030
{
1030-
"begin": "\\\\$\\s*",
1031+
"begin": "\\\\$\\s*?",
10311032
"end": "^(?<!\\G)",
10321033
"name": "constant.character.escape.newline.css"
10331034
},
@@ -1578,6 +1579,20 @@
15781579
{
15791580
"match": "(?i)even|odd",
15801581
"name": "support.constant.parity.css"
1582+
},
1583+
{
1584+
"begin": "(?xi)\n(?<=\n \\:nth-(?:last-)?child\\(\n (?:even|odd|[+-]?(\\d+n?|n)(\\s*[+-]\\s*\\d+)?)\\s*\n)\n(?:of)",
1585+
"beginCaptures": {
1586+
"0": {
1587+
"name": "keyword.operator.nth.of.css"
1588+
}
1589+
},
1590+
"end": "(?=\\))",
1591+
"patterns": [
1592+
{
1593+
"include": "#selector-innards"
1594+
}
1595+
]
15811596
}
15821597
]
15831598
}
@@ -1657,21 +1672,6 @@
16571672
"match": ">=|<=|=|<|>",
16581673
"name": "keyword.operator.comparison.css"
16591674
},
1660-
{
1661-
"captures": {
1662-
"1": {
1663-
"name": "constant.numeric.css"
1664-
},
1665-
"2": {
1666-
"name": "keyword.operator.arithmetic.css"
1667-
},
1668-
"3": {
1669-
"name": "constant.numeric.css"
1670-
}
1671-
},
1672-
"match": "(\\d+)\\s*(/)\\s*(\\d+)",
1673-
"name": "meta.ratio.css"
1674-
},
16751675
{
16761676
"include": "#numeric-values"
16771677
},
@@ -1707,6 +1707,21 @@
17071707
},
17081708
"numeric-values": {
17091709
"patterns": [
1710+
{
1711+
"captures": {
1712+
"1": {
1713+
"name": "constant.numeric.css"
1714+
},
1715+
"2": {
1716+
"name": "keyword.operator.arithmetic.css"
1717+
},
1718+
"3": {
1719+
"name": "constant.numeric.css"
1720+
}
1721+
},
1722+
"match": "(?<=aspect-ratio:.*)(\\d+)\\s*(/)\\s*(\\d+)",
1723+
"name": "meta.ratio.css"
1724+
},
17101725
{
17111726
"captures": {
17121727
"1": {
@@ -1725,7 +1740,7 @@
17251740
"name": "keyword.other.unit.${2:/downcase}.css"
17261741
}
17271742
},
1728-
"match": "(?xi) (?<![\\w-])\n[-+]? # Sign indicator\n\n(?: # Numerals\n [0-9]+ (?:\\.[0-9]+)? # Integer/float with leading digits\n | \\.[0-9]+ # Float without leading digits\n)\n\n(?: # Scientific notation\n (?<=[0-9]) # Exponent must follow a digit\n E # Exponent indicator\n [-+]? # Possible sign indicator\n [0-9]+ # Exponent value\n)?\n\n(?: # Possible unit for data-type:\n (%) # - Percentage\n | ( deg|grad|rad|turn # - Angle\n | Hz|kHz # - Frequency\n | ch|cm|em|ex|fr|in|mm|mozmm| # - Length\n pc|pt|px|q|rem|rch|rex|rlh|\n ic|ric|rcap|vh|vw|vb|vi|svh|\n svw|svb|svi|dvh|dvw|dvb|dvi|\n lvh|lvw|lvb|lvi|vmax|vmin|\n cqw|cqi|cqh|cqb|cqmin|cqmax\n | dpi|dpcm|dppx # - Resolution\n | s|ms # - Time\n )\n \\b # Boundary checking intentionally lax to\n)? # facilitate embedding in CSS-like grammars",
1743+
"match": "(?xi) (?<![\\w-])\n[-+]? # Sign indicator\n\n(?: # Numerals\n [0-9]+ (?:\\.[0-9]+)? # Integer/float with leading digits\n | \\.[0-9]+ # Float without leading digits\n)\n\n(?: # Scientific notation\n (?<=[0-9]) # Exponent must follow a digit\n E # Exponent indicator\n [-+]? # Possible sign indicator\n [0-9]+ # Exponent value\n)?\n\n(?: # Possible unit for data-type:\n (%) # - Percentage\n | ( deg|grad|rad|turn # - Angle\n | Hz|kHz # - Frequency\n | ch|cm|em|ex|fr|in|mm|mozmm| # - Length\n pc|pt|px|q|rem|rch|rex|rlh|\n ic|ric|rcap|vh|vw|vb|vi|svh|\n svw|svb|svi|dvh|dvw|dvb|dvi|\n lvh|lvw|lvb|lvi|vmax|vmin|\n dvmax|lvmax|svmax|\n dvmin|lvmin|svmin|\n cqw|cqi|cqh|cqb|cqmin|cqmax\n | dpi|dpcm|dppx # - Resolution\n | s|ms # - Time\n )\n \\b # Boundary checking intentionally lax to\n)? # facilitate embedding in CSS-like grammars",
17291744
"name": "constant.numeric.css"
17301745
}
17311746
]
@@ -1794,13 +1809,13 @@
17941809
{
17951810
"match": "!\\s*important(?![\\w-])",
17961811
"name": "keyword.other.important.css"
1797-
},
1798-
{
1799-
"match": "(?xi)\n# Match a slash as a property value delimiter if it's not enclosed by parentheses\n(?:\n (?<!\\([^\\)]*)\n /\n)",
1800-
"name": "meta.property-value.delimiter.css"
18011812
}
18021813
]
18031814
},
1815+
"property-value-delimiter": {
1816+
"match": "(?xi)\n# Match a slash as a property value delimiter if it's not enclosed by parentheses\n# Must be preceded by a colon and optionally other characters\n(?<= \\:.*\n)\n# Must not preceded by an opening parenthesis, after the colon, before a closing parenthesis\n(?<! \\:.*\\([^\\)]* )\n(?: / ) # Match a slash\n(?!= [^\\(]* \\) ) # Not followed by a closing parenthesis before an opening parenthesis",
1817+
"name": "punctuation.separator.delimiter.slash.css"
1818+
},
18041819
"pseudo-classes": {
18051820
"captures": {
18061821
"1": {

0 commit comments

Comments
 (0)