Skip to content

Commit d86f9cd

Browse files
author
Johannes J. Schmidt
committed
Relax keyframe selectors and property names
Support Skrollr Stylesheets, allow * numerical keyframes-selectors * generic alphanumeric keyframes-selectors (`top`) * propertys with `[word]`
1 parent 455dc95 commit d86f9cd

File tree

3 files changed

+137
-2
lines changed

3 files changed

+137
-2
lines changed

‎index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ module.exports = function(css, options){
179179
var pos = position();
180180

181181
// prop
182-
var prop = match(/^(\*?[-\/\*\w]+)\s*/);
182+
var prop = match(/^(\*?[-\/\*\w]+(\[[0-9a-z_-]+\])?)\s*/);
183183
if (!prop) return;
184184
prop = trim(prop[0]);
185185

@@ -232,7 +232,7 @@ module.exports = function(css, options){
232232
var vals = [];
233233
var pos = position();
234234

235-
while (m = match(/^(from|to|\d+%|\.\d+%|\d+\.\d+%)\s*/)) {
235+
while (m = match(/^((\d+\.\d+|\.\d+|\d+)%{0,1}|[a-z]+)\s*/)) {
236236
vals.push(m[1]);
237237
match(/^,\s*/);
238238
}

‎test/cases/keyframes.advanced.css

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
@keyframes advanced {
2+
top {
3+
opacity[sqrt]: 0;
4+
}
5+
6+
100 {
7+
opacity: 0.5;
8+
}
9+
10+
bottom {
11+
opacity: 1;
12+
}
13+
}

‎test/cases/keyframes.advanced.json

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
{
2+
"type": "stylesheet",
3+
"stylesheet": {
4+
"rules": [
5+
{
6+
"type": "keyframes",
7+
"name": "advanced",
8+
"keyframes": [
9+
{
10+
"type": "keyframe",
11+
"values": [
12+
"top"
13+
],
14+
"declarations": [
15+
{
16+
"type": "declaration",
17+
"property": "opacity[sqrt]",
18+
"value": "0",
19+
"position": {
20+
"start": {
21+
"line": 3,
22+
"column": 5
23+
},
24+
"end": {
25+
"line": 3,
26+
"column": 21
27+
}
28+
}
29+
}
30+
],
31+
"position": {
32+
"start": {
33+
"line": 2,
34+
"column": 3
35+
},
36+
"end": {
37+
"line": 4,
38+
"column": 4
39+
}
40+
}
41+
},
42+
{
43+
"type": "keyframe",
44+
"values": [
45+
"100"
46+
],
47+
"declarations": [
48+
{
49+
"type": "declaration",
50+
"property": "opacity",
51+
"value": "0.5",
52+
"position": {
53+
"start": {
54+
"line": 7,
55+
"column": 5
56+
},
57+
"end": {
58+
"line": 7,
59+
"column": 17
60+
}
61+
}
62+
}
63+
],
64+
"position": {
65+
"start": {
66+
"line": 6,
67+
"column": 3
68+
},
69+
"end": {
70+
"line": 8,
71+
"column": 4
72+
}
73+
}
74+
},
75+
{
76+
"type": "keyframe",
77+
"values": [
78+
"bottom"
79+
],
80+
"declarations": [
81+
{
82+
"type": "declaration",
83+
"property": "opacity",
84+
"value": "1",
85+
"position": {
86+
"start": {
87+
"line": 11,
88+
"column": 5
89+
},
90+
"end": {
91+
"line": 11,
92+
"column": 15
93+
}
94+
}
95+
}
96+
],
97+
"position": {
98+
"start": {
99+
"line": 10,
100+
"column": 3
101+
},
102+
"end": {
103+
"line": 12,
104+
"column": 4
105+
}
106+
}
107+
}
108+
],
109+
"position": {
110+
"start": {
111+
"line": 1,
112+
"column": 1
113+
},
114+
"end": {
115+
"line": 13,
116+
"column": 2
117+
}
118+
}
119+
}
120+
]
121+
}
122+
}

0 commit comments

Comments
 (0)