@less/test-data 4.9.0 → 5.0.0-alpha.2

package/tests-unit/at-rule-variable-interpolation/at-rule-variable-interpolation.css

@@ -0,0 +1,45 @@
+@media only screen and (max-width: 200px) {
+  .body {
+    width: 480px;
+  }
+}
+@media all and (tv) {
+  .all-and-tv {
+    var: yes;
+  }
+}
+@media screen, print {
+  .list {
+    margin: 0;
+  }
+}
+@container foo (min-width: 400px) {
+  .sticky-child {
+    font-size: 75%;
+  }
+}
+@supports (display: flex) {
+  .flex {
+    display: flex;
+  }
+}
+@supports (display: grid) and (gap: 1rem) {
+  .grid {
+    display: grid;
+  }
+}
+@keyframes enlarger {
+  from {
+    font-size: 12px;
+  }
+  to {
+    font-size: 15px;
+  }
+}
+@namespace less "http://lesscss.org";
+@namespace svgns "http://www.w3.org/2000/svg";
+@layer base {
+  .layered {
+    color: red;
+  }
+}

package/tests-unit/at-rule-variable-interpolation/at-rule-variable-interpolation.less

@@ -0,0 +1,72 @@
+// Less 5 coverage for variable interpolation in non-value at-rule positions
+// (at-rule preludes, names, and identifiers). Less 4.8 added a companion
+// deprecated-bare-@variable fixture; Less 5 keeps the migration target as the
+// positive parse/eval fixture.
+
+// --- nestable at-rule preludes ---
+@smartphone: ~"only screen and (max-width: 200px)";
+@media @{smartphone} {
+  .body {
+    width: 480px;
+  }
+}
+
+@all: ~"all";
+@tv: ~"(tv)";
+@media @{all} and @{tv} {
+  .all-and-tv {
+    var: yes;
+  }
+}
+
+@breakpoint: screen;
+@media @{breakpoint}, print {
+  .list {
+    margin: 0;
+  }
+}
+
+@varfoo: foo;
+@threshold: 400px;
+@container @{varfoo} (min-width: @threshold) {
+  .sticky-child {
+    font-size: 75%;
+  }
+}
+
+// --- unknown at-rule prelude ---
+@supported: ~"(display: flex)";
+@supports @{supported} {
+  .flex {
+    display: flex;
+  }
+}
+
+// A bare @variable in a *nested declaration value* (inside `(...)`) is a
+// declaration value, not a structural at-rule identifier/prelude position.
+@disp: grid;
+@supports (display: @disp) and (gap: 1rem) {
+  .grid {
+    display: grid;
+  }
+}
+
+// --- at-rule identifiers / names ---
+@anim: enlarger;
+@keyframes @{anim} {
+  from { font-size: 12px; }
+  to   { font-size: 15px; }
+}
+
+@ns: less;
+@namespace @{ns} "http://lesscss.org";
+
+@svg-ns: svgns;
+@namespace @{svg-ns} "http://www.w3.org/2000/svg";
+
+@layer-name: base;
+@layer @{layer-name} {
+  .layered {
+    color: red;
+  }
+}

package/tests-unit/at-rules/at-rules.css

@@ -15,7 +15,7 @@
 @namespace svg url(http://www.w3.org/2000/svg);
 @viewport {
   width: device-width;
-  initial-scale: 1;
+  initial-scale: 1.0;
 }
 @keyframes slidein {
   from {
@@ -82,8 +82,8 @@
     display: none;
   }
 }
-@media (max-width: 768px) {
-  .container {
+.container {
+  @media (max-width: 768px) {
     padding: 10px;
   }
 }
@@ -95,9 +95,11 @@
   margin-left: 3cm;
   margin-right: 4cm;
 }
-@media (max-width: 600px) {
-  .wrapper .mobile-only {
-    display: block;
+.wrapper {
+  @media (max-width: 600px) {
+    .mobile-only {
+      display: block;
+    }
   }
 }
 @media (min-width: 1024px) {

package/tests-unit/at-rules/legacy/at-rules.css

@@ -0,0 +1,110 @@
+/* Less 4.x output, recorded when this fixture graduated to v5.
+   Historical record only — no test reads this file. */
+
+@charset "UTF-8";
+@page {
+  margin: 2cm;
+  @top-left {
+    content: "Page " counter(page);
+  }
+}
+@page :first {
+  margin: 3cm;
+  @top-center {
+    content: "First Page";
+  }
+}
+@namespace url(http://www.w3.org/1999/xhtml);
+@namespace svg url(http://www.w3.org/2000/svg);
+@viewport {
+  width: device-width;
+  initial-scale: 1;
+}
+@keyframes slidein {
+  from {
+    margin-left: 100%;
+    width: 300%;
+  }
+  to {
+    margin-left: 0%;
+    width: 100%;
+  }
+}
+@keyframes "complex-animation" {
+  0% {
+    opacity: 0;
+    transform: scale(0.5);
+  }
+  50% {
+    opacity: 0.5;
+    transform: scale(1.2);
+  }
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+@font-face {
+  font-family: "MyFont";
+  src: url("myfont.woff2") format("woff2");
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: "CustomFont";
+  src: url("custom.woff") format("woff");
+}
+@supports (display: grid) {
+  .grid-container {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+  }
+}
+@supports (transform-style: preserve-3d) {
+  @media (min-width: 768px) {
+    .card {
+      transform: rotateY(15deg);
+    }
+  }
+}
+@media print {
+  body {
+    font-size: 12pt;
+    color: black;
+  }
+}
+@media screen {
+  @supports (display: flex) {
+    .container {
+      display: flex;
+    }
+  }
+}
+@media (max-width: 600px) {
+  .sidebar {
+    display: none;
+  }
+}
+@media (max-width: 768px) {
+  .container {
+    padding: 10px;
+  }
+}
+@page :left {
+  margin-left: 4cm;
+  margin-right: 3cm;
+}
+@page :right {
+  margin-left: 3cm;
+  margin-right: 4cm;
+}
+@media (max-width: 600px) {
+  .wrapper .mobile-only {
+    display: block;
+  }
+}
+@media (min-width: 1024px) {
+  .desktop {
+    display: block;
+  }
+}

package/tests-unit/at-rules/styles.config.ts

@@ -0,0 +1,5 @@
+export default {
+  output: [
+    { file: '{name}.css', collapseNesting: false }
+  ]
+}

package/tests-unit/at-rules-bubbling/at-rules-bubbling.css

@@ -0,0 +1,121 @@
+.parent {
+  color: green;
+}
+@document url-prefix() {
+  .parent .child {
+    color: red;
+  }
+}
+@supports (sandwitch: butter) {
+  .inside .top {
+    property: value;
+  }
+}
+@supports (sandwitch: bread) {
+  .in1 .in2 {
+    property: value;
+  }
+}
+@supports (sandwitch: ham) {
+  .inside .top {
+    property: value;
+  }
+}
+@supports (font-family: weirdFont) {
+  @font-face {
+    font-family: something;
+    src: made-up-url;
+  }
+}
+@font-face {
+  @supports not (-webkit-font-smoothing: subpixel-antialiased) {
+    font-family: something;
+    src: made-up-url;
+  }
+}
+@supports (property: value) {
+  @media (max-size: 2px) {
+    @supports (whatever: something) {
+      .outOfMedia {
+        property: value;
+      }
+    }
+  }
+}
+@supports (property: value) {
+  @media (max-size: 2px) {
+    @supports (whatever: something) {
+      .onTop {
+        property: value;
+      }
+    }
+  }
+}
+@media print {
+  html {
+    in-html: visible;
+  }
+  @supports (upper: test) {
+    html {
+      in-supports: first;
+    }
+    html div {
+      in-div: visible;
+    }
+    @supports not (-webkit-font-smoothing: subpixel-antialiased) {
+      html div {
+        in-supports: second;
+      }
+      @media screen {
+        html div {
+          font-weight: 400;
+        }
+        html div nested {
+          property: value;
+        }
+      }
+    }
+  }
+}
+@media print {
+  @media (max-size: 2px) {
+    .in1 {
+      stay: here;
+    }
+    @supports not (-webkit-font-smoothing: subpixel-antialiased) {
+      @supports (whatever: something) {
+        .in2 .in1 {
+          property: value;
+        }
+      }
+    }
+  }
+}
+html {
+  font-weight: 300;
+  -webkit-font-smoothing: subpixel-antialiased;
+}
+@supports not (-webkit-font-smoothing: subpixel-antialiased) {
+  html {
+    font-weight: 400;
+  }
+  html nested {
+    property: value;
+  }
+}
+@font-face {
+  font-family: something;
+  src: made-up-url;
+}
+@keyframes "textscale" {
+  0% {
+    font-size: 1em;
+  }
+  100% {
+    font-size: 2em;
+  }
+}
+.onTop {
+  animation: "textscale";
+  font-family: something;
+}

package/tests-unit/at-rules-bubbling/legacy/at-rules-bubbling.css

@@ -0,0 +1,122 @@
+/* Less 4.x output, recorded when this fixture graduated to v5.
+   Historical record only — no test reads this file. */
+
+.parent {
+  color: green;
+}
+@document url-prefix() {
+  .parent .child {
+    color: red;
+  }
+}
+@supports (sandwitch: butter) {
+  .inside .top {
+    property: value;
+  }
+}
+@supports (sandwitch: bread) {
+  .in1 .in2 {
+    property: value;
+  }
+}
+@supports (sandwitch: ham) {
+  .inside .top {
+    property: value;
+  }
+}
+@supports (font-family: weirdFont) {
+  @font-face {
+    font-family: something;
+    src: made-up-url;
+  }
+}
+@font-face {
+  @supports not (-webkit-font-smoothing: subpixel-antialiased) {
+    font-family: something;
+    src: made-up-url;
+  }
+}
+@supports (property: value) {
+  @media (max-size: 2px) {
+    @supports (whatever: something) {
+      .outOfMedia  {
+        property: value;
+      }
+    }
+  }
+}
+@supports (property: value) {
+  @media (max-size: 2px) {
+    @supports (whatever: something) {
+      .onTop  {
+        property: value;
+      }
+    }
+  }
+}
+@media print {
+  html {
+    in-html: visible;
+  }
+  @supports (upper: test) {
+    html {
+      in-supports: first;
+    }
+    html div {
+      in-div: visible;
+    }
+    @supports not (-webkit-font-smoothing: subpixel-antialiased) {
+      html div {
+        in-supports: second;
+      }
+      @media screen {
+        html div {
+          font-weight: 400;
+        }
+        html div nested {
+          property: value;
+        }
+      }
+    }
+  }
+}
+@media print and (max-size: 2px) {
+  .in1 {
+    stay: here;
+  }
+  @supports not (-webkit-font-smoothing: subpixel-antialiased) {
+    @supports (whatever: something) {
+      .in2 .in1 {
+        property: value;
+      }
+    }
+  }
+}
+html {
+  font-weight: 300;
+  -webkit-font-smoothing: subpixel-antialiased;
+}
+@supports not (-webkit-font-smoothing: subpixel-antialiased) {
+  html {
+    font-weight: 400;
+  }
+  html nested {
+    property: value;
+  }
+}
+.onTop {
+  animation: "textscale";
+  font-family: something;
+}
+@font-face {
+  font-family: something;
+  src: made-up-url;
+}
+@keyframes "textscale" {
+  0% {
+    font-size: 1em;
+  }
+  100% {
+    font-size: 2em;
+  }
+}

package/tests-unit/at-rules-keyword-comments/at-rules-keyword-comments.css

@@ -1,9 +1,6 @@
-@import "test.css" screen, print;
-@media screen, print, handheld {
-  /* comment */
-  /* another */
+@import "test.css" screen /* comment */, print;
+@media screen /* comment */, print /* another */, handheld {
   body {
     font-size: 12pt;
   }
 }
-/* comment */

package/tests-unit/at-rules-keyword-comments/legacy/at-rules-keyword-comments.css

@@ -0,0 +1,12 @@
+/* Less 4.x output, recorded when this fixture graduated to v5.
+   Historical record only — no test reads this file. */
+
+@import "test.css" screen, print;
+@media screen, print, handheld {
+  /* comment */
+  /* another */
+  body {
+    font-size: 12pt;
+  }
+}
+/* comment */

package/tests-unit/at-rules-targeted/at-rules-targeted.css

@@ -19,9 +19,11 @@
   margin: 2cm;
   size: A4;
 }
-@media screen and (max-width: 768px) {
-  .nested {
-    display: block;
+@media screen {
+  @media (max-width: 768px) {
+    .nested {
+      display: block;
+    }
   }
 }
 @media screen {

package/tests-unit/at-rules-targeted/legacy/at-rules-targeted.css

@@ -0,0 +1,55 @@
+/* Less 4.x output, recorded when this fixture graduated to v5.
+   Historical record only — no test reads this file. */
+
+@charset "UTF-8";
+@media screen {
+  .test {
+    color: red;
+  }
+}
+@media screen, print, handheld {
+  body {
+    font-size: 12pt;
+  }
+}
+@supports (display: grid) {
+  .grid {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+  }
+}
+@page {
+  margin: 2cm;
+  size: A4;
+}
+@media screen and (max-width: 768px) {
+  .nested {
+    display: block;
+  }
+}
+@media screen {
+  .container {
+    color: red;
+  }
+  .container .child {
+    color: blue;
+  }
+}
+@media screen {
+  .test-var-access {
+    color: value;
+  }
+}
+@layer base {
+  body {
+    margin: 0;
+  }
+  p {
+    padding: 0;
+  }
+}
+@media screen {
+  body {
+    color: black;
+  }
+}

package/tests-unit/calc/calc.css

@@ -1,7 +1,7 @@
 .calc-basic {
   width: calc(100% - 30px);
   height: calc(50% + 20px);
-  margin: calc(10px * 2);
+  margin: 20px;
   padding: calc(100vh - 50px);
 }
 .calc-variables {
@@ -11,19 +11,19 @@
   height: calc(50% + (25vh - 20px));
 }
 .calc-nested {
-  min-height: calc(10vh + calc(5vh));
-  nested: calc(calc(2.25rem + 2px) - 1px * 2);
+  min-height: 15vh;
+  nested: calc((2.25rem + 2px) - 2px);
 }
 .calc-functions {
   one: calc(100% - 20px);
-  two: calc(100% - (10px + 10px));
+  two: calc(100% - 20px);
   bar: calc(1 + 20%);
 }
 .calc-escape {
-  three: calc(100% - (3 * 1));
-  four: calc(100% - (3 * 1));
+  three: calc(100% - 3);
+  four: calc(100% - 3);
 }
 .calc-mixed {
-  foo: 3 calc(3 + 4) 11;
-  height: calc(100% - ((10px * 3) + (10px * 2)));
+  foo: 3 7 11;
+  height: calc(100% - 50px);
 }

package/tests-unit/calc/calc.less

@@ -1,3 +1,4 @@
+// Less v5 can further simplify a number of these calc expressions
 @val: 10px;
 @var: 50vh/2;
 

package/tests-unit/calc/legacy/calc.css

@@ -0,0 +1,32 @@
+/* Less 4.x output, recorded when this fixture graduated to v5.
+   Historical record only — no test reads this file. */
+
+.calc-basic {
+  width: calc(100% - 30px);
+  height: calc(50% + 20px);
+  margin: 20px;
+  padding: calc(100vh - 50px);
+}
+.calc-variables {
+  root: calc(100% - 30px);
+  root2: calc(100% - 40px);
+  width: calc(50% + (25vh - 20px));
+  height: calc(50% + (25vh - 20px));
+}
+.calc-nested {
+  min-height: calc(10vh + calc(5vh));
+  nested: calc(calc(2.25rem + 2px) - 1px * 2);
+}
+.calc-functions {
+  one: calc(100% - 20px);
+  two: calc(100% - (10px + 10px));
+  bar: calc(1 + 20%);
+}
+.calc-escape {
+  three: calc(100% - (3 * 1));
+  four: calc(100% - (3 * 1));
+}
+.calc-mixed {
+  foo: 3 calc(3 + 4) 11;
+  height: calc(100% - ((10px * 3) + (10px * 2)));
+}

package/tests-unit/color-functions/basic.css

@@ -14,5 +14,5 @@
 }
 #percentage {
   color: 255;
-  border-color: rgba(255, 0, 0, 0.5);
+  border-color: rgba(100%, 0, 0, 50%);
 }

package/tests-unit/color-functions/comprehensive.css

@@ -29,17 +29,17 @@
 }
 #percentage {
   color: 255;
-  border-color: rgba(255, 0, 0, 0.5);
+  border-color: rgba(100%, 0, 0, 50%);
 }
 #grey {
-  color: #c8c8c8;
+  color: rgb(200, 200, 200);
 }
 #aa3333 {
-  color: #aa3333;
+  color: rgb(66.66%, 20%, 20%);
 }
 #bb8080 {
-  color: hsl(0, 30%, 62%);
+  color: hsl(0deg, 30%, 62%);
 }
 #ccff00 {
-  color: hsl(72, 100%, 50%);
+  color: hsl(72deg, 100%, 50%);
 }