Skip to content

Commit

Permalink
Update specs for full support for Media Queries 4 (#1833)
Browse files Browse the repository at this point in the history 
Closes #1798
  • Loading branch information
@nex3
nex3 committed Nov 1, 2022
1 parent b682f8e commit 17a5678
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 112 deletions.
105 changes: 7 additions & 98 deletions spec/css/media/logic/nested.hrx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,175 +2,84 @@
@media (not (a)) {x {y: z}}

<===> raw/not/lowercase/output.css
@media (false) {
@media not (a) {
x {
y: z;
}
}

<===> raw/not/lowercase/warning
DEPRECATION WARNING on line 1, column 9 of input.scss:
Starting a @media query with "not" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{not (a)}
To migrate to new behavior: #{"not (a)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media (not (a)) {x {y: z}}
| ^^^^^^^
'

<===>
================================================================================
<===> raw/not/mixed_case/input.scss
@media (NoT (a)) {x {y: z}}

<===> raw/not/mixed_case/output.css
@media (NoT a) {
@media not (a) {
x {
y: z;
}
}

<===> raw/not/mixed_case/warning
DEPRECATION WARNING on line 1, column 9 of input.scss:
Starting a @media query with "not" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{NoT (a)}
To migrate to new behavior: #{"NoT (a)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media (NoT (a)) {x {y: z}}
| ^^^^^^^
'

<===>
================================================================================
<===> raw/and/lowercase/input.scss
@media ((a) and (b)) {x {y: z}}

<===> raw/and/lowercase/output.css
@media (b) {
@media ((a) and (b)) {
x {
y: z;
}
}

<===> raw/and/lowercase/warning
DEPRECATION WARNING on line 1, column 9 of input.scss:
Starting a @media query with "(" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{(a) and (b)}
To migrate to new behavior: #{"(a) and (b)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media ((a) and (b)) {x {y: z}}
| ^^^^^^^^^^^
'

<===>
================================================================================
<===> raw/and/mixed_case/input.scss
@media ((a) AnD (b)) {x {y: z}}

<===> raw/and/mixed_case/output.css
@media (a AnD b) {
@media ((a) and (b)) {
x {
y: z;
}
}

<===> raw/and/mixed_case/warning
DEPRECATION WARNING on line 1, column 9 of input.scss:
Starting a @media query with "(" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{(a) AnD (b)}
To migrate to new behavior: #{"(a) AnD (b)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media ((a) AnD (b)) {x {y: z}}
| ^^^^^^^^^^^
'

<===>
================================================================================
<===> raw/or/lowercase/input.scss
@media ((a) or (b)) {x {y: z}}

<===> raw/or/lowercase/output.css
@media (a) {
@media ((a) or (b)) {
x {
y: z;
}
}

<===> raw/or/lowercase/warning
DEPRECATION WARNING on line 1, column 9 of input.scss:
Starting a @media query with "(" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{(a) or (b)}
To migrate to new behavior: #{"(a) or (b)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media ((a) or (b)) {x {y: z}}
| ^^^^^^^^^^
'

<===>
================================================================================
<===> raw/or/mixed_case/input.scss
@media ((a) Or (b)) {x {y: z}}

<===> raw/or/mixed_case/output.css
@media (a Or b) {
@media ((a) or (b)) {
x {
y: z;
}
}

<===> raw/or/mixed_case/warning
DEPRECATION WARNING on line 1, column 9 of input.scss:
Starting a @media query with "(" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{(a) Or (b)}
To migrate to new behavior: #{"(a) Or (b)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media ((a) Or (b)) {x {y: z}}
| ^^^^^^^^^^
'

<===>
================================================================================
<===> raw/different_than_top_level/input.scss
@media (a) and ((b) or (c)) {x {y: z}}

<===> raw/different_than_top_level/output.css
@media (a) and (b) {
@media (a) and ((b) or (c)) {
x {
y: z;
}
}

<===> raw/different_than_top_level/warning
DEPRECATION WARNING on line 1, column 17 of input.scss:
Starting a @media query with "(" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{(b) or (c)}
To migrate to new behavior: #{"(b) or (c)"}

For details, see https://sass-lang.com/d/media-logic
,
1 | @media (a) and ((b) or (c)) {x {y: z}}
| ^^^^^^^^^^
'

<===>
================================================================================
<===> interpolated/not/lowercase/input.scss
Expand Down
15 changes: 1 addition & 14 deletions spec/libsass-closed-issues/issue_485.hrx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,21 +18,8 @@
foo: bar;
}
}
@media (false), print and (color) {
@media not (color), print and (color) {
a {
foo: bar;
}
}

<===> warning
DEPRECATION WARNING on line 3, column 9 of input.scss:
Starting a @media query with "not" is deprecated because it conflicts with official CSS syntax.

To preserve existing behavior: #{not (screen and (color))}
To migrate to new behavior: #{"not (screen and (color))"}

For details, see https://sass-lang.com/d/media-logic
,
3 | @media (not (screen and (color))), print and (color) { a {foo: bar} }
| ^^^^^^^^^^^^^^^^^^^^^^^^
'

0 comments on commit 17a5678

Please sign in to comment.