Skip to content

Feature Proposal: if() function #3019

Closed
@matthew-dean

Description

@matthew-dean

In the course of discussing changes to the contrast() function (which was changed and reverted, but will be changed again for 3.0 - see: #2754 (comment)), it came up that the legacy contrast function was really something of an if/then/else function, with the actual test condition simply one step removed from visibility.

That is, given: contrast(a, b, c, d) this is the test:

if luma(a) < d output b;
else output c;

Therefore, with contrast changing, the proposal on the table is to add, in the future, a generic if() function, with this signature:

if(condition, thenResult, elseResult)

  • condition has the same signature / format as a when condition in Less, with the exception that it cannot contain a comma as a logical OR, as that would denote an argument separator. However, Less now supports the or keyword and it is now the preferred format for a logical OR.

The above statement could then be replaced with something like the usage below:

@color1: #fefefe;
.box {
    color: if(luma(@color1) > 0.43, #333, #999);
}

@seven-phases-max noted that implementation is non-trivial (which I agree), but could be a very valuable addition to Less functions, since you could use it for other purposes besides only testing for a luma() value.

.box {
  font-size: if(unit(@width) = `rem`, 1.2rem, 12px);
}

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions