AtHeartEngineer/less.js
1
1
Fork 0
mirror of https://github.com/less/less.js.git synced 2026-01-09 15:48:08 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(issue:4301) at-rule declarations missing (#4302)

Browse Source 
* Fixes issue #4301. At-rule declarations may go missing or are
  incorrectly merged under certain nesting conditions.
* Added more ```@container``` tests.
This commit is contained in:
Daniel Puckowski
2025-01-02 11:38:31 -05:00
committed by GitHub
parent 145d95ee9c
commit 9d92b0ca3b
3 changed files with 176 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/less/src/less/tree/nested-at-rule.js
View File

@@ -45,6 +45,12 @@ const NestableAtRulePrototype = {
// Extract the media-query conditions separated with `,` (OR).
for (i = 0; i < path.length; i++) {
if (path[i].type !== this.type) {
context.mediaBlocks.splice(i, 1);
return this;
}
value = path[i].features instanceof Value ?
path[i].features.value : path[i].features;
path[i] = Array.isArray(value) ? value : [value];

76
packages/test-data/css/_main/container.css
View File

@@ -165,3 +165,79 @@
max-height: 300;
}
}
@media only screen and (min-width: 768px) {
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
}
.media-2 {
font-size: 2rem;
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
@media (hover: hover) {
font-size: 1.75rem;
}
}
.media-2 {
font-size: 2rem;
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
@media (hover: hover) {
font-size: 1.75rem;
@media not all and (hover: hover) {
color: limegreen;
}
.media-3 {
padding: 0.5rem;
}
}
}
.media-2 {
font-size: 2rem;
}
}
@container (min-width: 768px) {
@media only screen and (min-width: 768px) {
color: aliceblue;
}
.container-1 {
color: purple;
}
}

94
packages/test-data/less/_main/container.less
View File

@@ -195,3 +195,97 @@
.my_mixin(100);
.my_mixin(200);
.my_mixin(300);
@media only screen and (min-width: 768px) {
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
}
.media-2 {
font-size: 2rem;
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
@media (hover: hover) {
font-size: 1.75rem;
}
}
.media-2 {
font-size: 2rem;
}
}
@media only screen and (min-width: 768px) {
.media-1 {
font-size: 1.5rem;
}
@container (min-width: 500px) {
.primary-content {
font-size: 1rem;
}
@media (hover: hover) {
font-size: 1.75rem;
@media not all and (hover: hover) {
color: limegreen;
}
.media-3 {
padding: 0.5rem;
}
}
}
.media-2 {
font-size: 2rem;
}
}
@container (min-width: 768px) {
@media only screen and (min-width: 768px) {
color: aliceblue;
}
.container-1 {
color: purple;
}
}