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 Variables not supported in media queries for breakpoint tokens #121

Closed
josh-bagwell opened this issue Jul 16, 2024 · 2 comments
Closed
Labels
bug Something isn't working

Comments

@josh-bagwell
Copy link

josh-bagwell commented Jul 16, 2024

🐛 Bug Report

Expected Behavior

Breakpoint tokens currently do not work as intended.

This is due to css variables not being supported inside of media queries currently.

The below will not work:

[`@media screen and (max-width: ${cssVar(system.breakpoints.m)})`]: {}

But this will:

[`@media screen and (max-width: 48rem)`]: {}

Actual Behavior

What ends up happening is the value for the breakpoint is not used since css variables are not supported by media queries.

@josh-bagwell josh-bagwell added the bug Something isn't working label Jul 16, 2024
@josh-bagwell josh-bagwell changed the title calc Not Supported in media queries calc Not Supported in media queries for breakpoint tokens Jul 16, 2024
@josh-bagwell josh-bagwell changed the title calc Not Supported in media queries for breakpoint tokens CSS Variables not supported in media queries for breakpoint tokens Jul 18, 2024
@RayRedGoose
Copy link
Contributor

Value should be in px

@RayRedGoose
Copy link
Contributor

close with #124

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
Status: ✅ Done
Development

No branches or pull requests

2 participants