Skip to content
This repository has been archived by the owner on Feb 18, 2022. It is now read-only.

Whitespace removed for variables followed by comma #193

Open
dtothefp opened this issue Aug 15, 2019 · 1 comment
Open

Whitespace removed for variables followed by comma #193

dtothefp opened this issue Aug 15, 2019 · 1 comment

Comments

@dtothefp
Copy link

When using variables for a CSS transition followed by a comma white space is removed between the transition properties which breaks the transition:

ex.

// pre-compiled.css
:root {
  --transition-transform: transform 0.3s ease-out;
}

.bg {
  transition: var(--transition-transform), visibility 0.3s ease-out;
}
// compiled css
:root {
  --transition-transform: transform 0.3s ease-out;
}

.bg {
  transition: transform0.3sease-out, visibility 0.3s ease-out;
  transition: var(--transition-transform), visibility 0.3s ease-out;
}

If a whitespace is added to the comma following the property the whitespace will be preserved

// pre-compiled.css
:root {
  --transition-transform: transform 0.3s ease-out;
}

.bg {
  transition: var(--transition-transform) , visibility 0.3s ease-out;
}
// compiled css
:root {
  --transition-transform: transform 0.3s ease-out;
}

.bg {
  transition: transform 0.3s ease-out , visibility 0.3s ease-out;
  transition: var(--transition-transform) , visibility 0.3s ease-out;
}
@ArturAntonov
Copy link

ArturAntonov commented Jan 6, 2022

Have the same error
From this
:root { --input-border-bottom-idle: inset 0 -1px 0 0 var(--c-primary-light); }
I get this incorrect style
"--input-border-bottom-idle": "inset,0,-1px,0,0,var(--c-primary-light)",

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

No branches or pull requests

2 participants