Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS environment variables throwing error when used with max() #2535

Closed
fsaenger opened this issue Jan 15, 2018 · 4 comments
Closed

CSS environment variables throwing error when used with max() #2535

fsaenger opened this issue Jan 15, 2018 · 4 comments

Comments

@fsaenger
Copy link

fsaenger commented Jan 15, 2018

input.scss

@supports(padding: max(0px)) {
  .test {
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
  }
}

Actual results

libsass 3.5.0.beta.3

Error: "env(safe-area-inset-left)" is not a number for `max'
        on line 3 of stdin
>>     padding-left: max(12px, env(safe-area-inset-left));
   ------------------^

Expected result

@supports(padding: max(0px)) {
  .test {
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
  }
}

version info:
Same as used in SourceMap Inspector, linked above, libsass 3.5.0.beta.3.

First ran into error with:

$ node-sass --version
node-sass	4.7.2	(Wrapper)	[JavaScript]
libsass  	3.5.0.beta.2	(Sass Compiler)	[C/C++]

Why this should work

This is the recommended syntax by the WebKit team to adjust CSS for iPhone X, see:
https://webkit.org/blog/7929/designing-websites-for-iphone-x/

@fsaenger
Copy link
Author

Sorry, couldn't properly link to SourceMap Inspector because it doesn't store code that throws errors.

@nschonni
Copy link
Collaborator

Duplicate of #2521

@nschonni nschonni marked this as a duplicate of #2521 Jan 15, 2018
@fsaenger
Copy link
Author

Sorry about that, @nschonni, my mistake.

@nschonni
Copy link
Collaborator

No problem, it happens

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants