less / less.js

Less. The dynamic stylesheet language.
http://lesscss.org
Apache License 2.0
17.02k stars 3.41k forks source link

Modern color function notation works incorrectly #3685

Closed Greatshock closed 2 years ago

Greatshock commented 2 years ago

To reproduce:

body {
   background: rgb(242 243 245 / 40%);
}

Current behavior:

Results into CSS:

body {
  color: rgb(242 243 6.125%);
}

Expected behavior:

body {
   background: rgb(242 243 245 / 40%);
}

So modern color function notation works incorrectly. This also might be a duplicate of #3665

fuchunhui commented 2 years ago

hey, provide the version number please.

I tested it used the lasted release@4.1.2, everything is ok.

change the source, test-data/less/_main/color2.less

foo {
  color: rgb(0 128 255);
  color: rgb(0 128 255 / 50%);
  color: hsl(198deg 28% 50%);
  color: hsl(198deg 28% 50% / 50%);
}
body {
  background: rgb(242 243 245 / 40%);
  color: rgb(0 0 0 / 0.03);
}

then, lessc colors2.less, we will get

foo {
  color: #0080ff;
  color: rgba(0, 128, 255, 0.5);
  color: hsl(198, 28%, 50%);
  color: hsla(198, 28%, 50%, 0.5);
}
body {
  background: rgba(242, 243, 245, 0.4);
  color: rgba(0, 0, 0, 0.03);
}
fuchunhui commented 2 years ago

And, the less-preview is using the an old version(less@3.3.1).

we needed update it. && the less-doc. @iChenLei 文档有一些内容已经过期了。

iChenLei commented 2 years ago

@fuchunhui Known issue, but thanks.

Greatshock commented 2 years ago

@fuchunhui you are right, everything is ok in the latest version. Thanks!