Function

@mirror, @Mirror

A list followed by its reverse. @mirror(1, 2, 3) is 1, 2, 3, 3, 2, 1; @Mirror(1, 2, 3) does not repeat the middle: 1, 2, 3, 2, 1.

Syntax

  • @pn.mirror(<value>, ...)
  • @pn.Mirror(<value>, ...)

Used on its own the whole list is emitted comma-separated. Compose it with @pn to walk through the mirrored list cell by cell.

Examples

@grid: 6x1 / 60vmin _1px;
background: @pn.mirror(#000, #e6437d, #ebbf4d);
@grid: 9x1 / 60vmin;
background: #000;
align-self: center;
height: @pn.Mirror(20%, 40%, 60%, 80%, 100%);

A symmetric gradient:

@grid: 1 / 60vmin;
background: linear-gradient(
  90deg,
  @mirror(#000, #e6437d, #ebbf4d)
);

See also