File tree Expand file tree Collapse file tree 6 files changed +25
-13
lines changed
test/test-cases/media-queries Expand file tree Collapse file tree 6 files changed +25
-13
lines changed Original file line number Diff line number Diff line change @@ -21,7 +21,6 @@ export default class Core {
21
21
}
22
22
}
23
23
24
-
25
24
// These three plugins are aliased under this package for simplicity.
26
25
Core . localByDefault = localByDefault
27
26
Core . extractImports = extractImports
Original file line number Diff line number Diff line change @@ -53,7 +53,7 @@ export default class Parser {
53
53
Object . keys ( this . translations ) . forEach ( translation => {
54
54
decl . value = decl . value . replace ( translation , this . translations [ translation ] )
55
55
} )
56
- this . exportTokens [ decl . prop ] = decl . value
56
+ this . exportTokens [ decl . prop ] = decl . value . replace ( / ^ [ ' " ] | [ ' " ] $ / g , '' )
57
57
}
58
58
} )
59
59
exportNode . removeSelf ( )
@@ -65,7 +65,12 @@ export default class Parser {
65
65
return this . pathFetcher ( file , relativeTo , depTrace ) . then ( exports => {
66
66
importNode . each ( decl => {
67
67
if ( decl . type == 'decl' ) {
68
- this . translations [ decl . prop ] = exports [ decl . value ] . replace ( / ^ [ ' " ] | [ ' " ] $ / g, '' )
68
+ let translation = exports [ decl . value ]
69
+ if ( translation ) {
70
+ this . translations [ decl . prop ] = translation . replace ( / ^ [ ' " ] | [ ' " ] $ / g, '' )
71
+ } else {
72
+ console . warn ( `Missing ${ decl . value } for ${ decl . prop } ` )
73
+ }
69
74
}
70
75
} )
71
76
importNode . removeSelf ( )
Original file line number Diff line number Diff line change 1
1
@custom-media --small (max-width : 30em );
2
2
@custom-media --medium (max-width : 60em );
3
- @custom-media --large (max-width : 90em );
Original file line number Diff line number Diff line change 1
- ._media-queries_source__red {
1
+ @custom-media --small (max-width : 30em );
2
+ @custom-media --medium (max-width : 60em );
3
+ @custom-media --small (max-width : 30em );
4
+ @custom-media --medium (max-width : 60em );
5
+ @custom-media --large (max-width : 90em );
6
+
7
+ ._media_queries_source__red {
2
8
color : red;
3
9
}
4
10
5
- @media (max-width : 30 em ) {
6
- ._media-queries_source__red {
11
+ @media (--small ) {
12
+ ._media_queries_source__red {
7
13
color : maroon;
8
14
}
9
15
}
10
16
11
- @media (max-width : 60 em ) {
12
- ._media-queries_source__red {
17
+ @media (--medium ) {
18
+ ._media_queries_source__red {
13
19
color : darkmagenta;
14
20
}
15
21
}
16
22
17
- @media (max-width : 90 em ) {
18
- ._media-queries_source__red {
23
+ @media (--large ) {
24
+ ._media_queries_source__red {
19
25
color : fuchsia;
20
26
}
21
27
}
Original file line number Diff line number Diff line change 1
1
{
2
- "red" : " _media-queries_source__red"
2
+ "red" : " _media_queries_source__red" ,
3
+ "--small" : " (max-width: 30em)" ,
4
+ "--medium" : " (max-width: 60em)" ,
5
+ "--large" : " (max-width: 90em)"
3
6
}
Original file line number Diff line number Diff line change 1
1
@custom-media --small from "./breakpoints.css" ;
2
2
@custom-media --medium from "./breakpoints.css" ;
3
- @custom-media --large (min -width: 90em );
3
+ @custom-media --large (max -width: 90em );
4
4
5
5
.red {
6
6
color : red;
You can’t perform that action at this time.
0 commit comments