Eliminate duplication when overriding inherited mixin properties

[mkoistinen]

Hi, I don't know if this is a duplicate request, I tried searching the issues and didn't find anything like this.

Given this less source file:

 // Generic menu structure (many details left out for brevity here...)
.menu() { // UL
  li {
    list-style-type: none;

    &:before {
      content:  "\2022 "; // Unicode for a bullet
    }

    &:first-child {
      &:before {
        content: "";
      }
    }
  }
}


// I would like this to be a menu, but with a different separator...
.my-menu { // UL
  .menu;

  li:before {
    content: "|";
  }
}

The resulting output is this:

.my-menu li {
  list-style-type: none;
}
.my-menu li:before {
  content: "\2022 ";    // <-- THIS IS OVERRIDDEN BY…
}
.my-menu li:first-child:before {
  content: "";
}
.my-menu li:before {
  content: "|";        // <-- THIS.
}

Ideally, the duplicate property(-ies) would be removed since we know them to be overridden.

[dmcass]

While I still understand your concern, the problem in the example is solved with parametric mixins. You're already using more code in your Less than you need to.

.menu(@sep: "\2022 ") {
  li {
    list-style-type: none;

    &:before {
      content:  @sep;
    }

    &:first-child {
      &:before {
        content: "";
      }
    }
  }
}

.my-menu {
  .menu("|");
}

Result

.my-menu li { list-style-type: none; }
.my-menu li:before { content: "|"; }
.my-menu li:first-child:before { content: ""; }

If possible, can you provide an example where this problem is not solved by parametric mixins?

[mkoistinen]

You are of course correct, but perhaps this is a poor example. This is a general inheritance issue. Rewriting mixins to add new parameters each time I want to override something else isn't always practical.

[lukeapage]

The trouble is that people frequently use multiple properties in order to provide a fallback for older browsers.. removing the properties is not something that it would be good to do generically.

In your case I would split your mixin in 2 and put a guard on the one outputting something you don't want - then you can use an argument to switch it on or off.