Skip to content

Allow multiline css declarations in less files for increased readability #471

Open
@hostep

Description

@hostep

Preconditions

  1. Have a file test1.less like this:
& when (@media-common = true) {
    .lib-icon-font(
        @icon-camera__content,
        @_icon-font: @icons-admin__font-name,
        @_icon-font-size: @image-gallery-placeholder-icon__size,
        @_icon-font-color: @image-gallery-placeholder-icon__color,
        @_icon-font-text-hide: true
    );
}
  1. Have a file test2.less like this:
& when (@media-common = true) {
    .lib-icon-font(@icon-camera__content, @_icon-font: @icons-admin__font-name, @_icon-font-size: @image-gallery-placeholder-icon__size, @_icon-font-color: @image-gallery-placeholder-icon__color, @_icon-font-text-hide: true);
}
  1. See that the contents of these 2 files are the same, it's just the formatting of the code that's different

Steps to reproduce

  1. Run vendor/bin/phpcs -s --standard=Magento2 test*.less

Expected result

  1. Both files should show no errors

Actual result

  1. Getting this output:
FILE: test1.less
-------------------------------------------------------------------------------------------------------------------------
FOUND 0 ERRORS AND 4 WARNINGS AFFECTING 4 LINES
-------------------------------------------------------------------------------------------------------------------------
 4 | WARNING | Expected 1 space after colon in style definition; newline found
   |         | (Magento2.Less.ColonSpacing.AfterNewline)
 5 | WARNING | Expected 1 space after colon in style definition; newline found
   |         | (Magento2.Less.ColonSpacing.AfterNewline)
 6 | WARNING | Expected 1 space after colon in style definition; newline found
   |         | (Magento2.Less.ColonSpacing.AfterNewline)
 7 | WARNING | Expected 1 space after colon in style definition; newline found
   |         | (Magento2.Less.ColonSpacing.AfterNewline)
-------------------------------------------------------------------------------------------------------------------------

Time: 78ms; Memory: 6MB

Discussion

In my opinion, the formatting of the code in file test1.less is a lot more readable then in file test2.less. Coding standards shouldn't recommend to make code less readable.
Also, Magento uses this syntax as well in its own code and is thus violating its own coding standards ...

This was already reported before, but just in a comment on another issue, now it has its own proper issue which might make it faster to get picked up?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    Status

    Ready for Grooming

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions