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

Master fix 4224 and fix 3777 #4297

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

puckowski
Copy link
Contributor

What:

Why:

Less.js was producing invalid CSS output for certain CSS custom property scenarios.

Checklist:

  • Documentation
  • Added/updated unit tests
  • Code complete

Takes this Less.js:

.test {
    --basic-deg: 20deg;
    --basic-deg-tan: tan(var(--basic-deg));
}

.test2 {
    --some-var: 5%;
    prop: min(100% - var(--some-var), 10px);
}

.test3 {
    --some-var: 55%;
    prop: min(var(--some-var) + 5%, 15px);
}

.test4 {
    color: red;
    --other-color: green;
}

.test5 {
    --font-level: 5;
    prop: pow(var(--font-ratio-min), var(--font-level, 0))
}

.test6 {
    --some-var: 5px;
    prop: min(100% - var(--some-var, var(--somevar, 0)), 10px);
}

.test7 {
    --some-var: 6px;
    --some-var-2: 7px;
    prop: min(100% - var(--some-var, var(--somevar, var(--some-var-2, 8px))), 10px);
}

and outputs:

.test {
  --basic-deg: 20deg;
  --basic-deg-tan: tan(var(--basic-deg));
}
.test2 {
  --some-var: 5%;
  prop: min(100% - var(--some-var), 10px);
}
.test3 {
  --some-var: 55%;
  prop: min(var(--some-var) + 5%, 15px);
}
.test4 {
  color: red;
  --other-color: green;
}
.test5 {
  --font-level: 5;
  prop: var(--font-ratio-min), var(--font-level, 0);
}
.test6 {
  --some-var: 5px;
  prop: min(100% - var(--some-var, var(--somevar, 0)), 10px);
}
.test7 {
  --some-var: 6px;
  --some-var-2: 7px;
  prop: min(100% - var(--some-var, var(--somevar, var(--some-var-2, 8px))), 10px);
}

* Fixes CSS custom property handling to address issue less#4224 and issue
  less#3777.
* Added new CSS custom property tests.
* Improves CSS custom property initial value support, including nesting
  scenarios to better address issue less#3777.
* Add more CSS custom property tests.
@dosubot dosubot bot added the size:L This PR changes 100-499 lines, ignoring generated files. label Dec 7, 2024
@puckowski
Copy link
Contributor Author

I submitted a few PRs. I expect rebase(s) will be needed in order to merge all of them, so let me know when a rebase is needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
size:L This PR changes 100-499 lines, ignoring generated files.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant