Add short-names module with mixin names that are shorter than the defaults

[kakubei]

This migh sound like a stupid question, but I've got some elements where I'm using zen-clear() for some pages, but then in one particular page I need to remove the zen-clear() statement cause it's causing problems. I've got a SCSS file for that page but am wondering how do I negate the zen-clear() mixin?

It gets inherited from the other css since it's only a small change I don't want to redo the whole page for just 1 element.

Thanks.

[JohnAlbin]

Hi @kakubei! I'm working on #48 which will give you exactly what you want in Zen Grids 2.0.

You can get similar functionality with Zen Grids 1.x by adding this custom mixin to your codebase. (I won't be adding it officially to the 1.x branch.)

@mixin undo-zen-clear() {
  clear: none;
}

As to what selector to use, I suggest adding a custom class to that element on that one page. Basically, that element has a "variant" on that page. You should be able to reuse that variant class on any other pages that need that variation.

[kakubei]

Great, thanks a lot John. And thanks for Zen grids, I really like it and plan to use it in my future web sites when I can get away with it.

The only little niggle I have is I wish the mixins where shorter, they're hard to remember (zen-grid-container as opposed to 'container' for example, etc), but I guess you chose those names to make sure they didn't conflict with anything else.

Maybe in the future we could create aliases for them :)

[JohnAlbin]

Maybe in the future we could create aliases for them.

Now that's an idea! Have an optional module with short names. So you'd @import zen-grids/short-names; and then use the really short mixin names instead of the longer ones.