syntax - LESS namespaces: "#namespace > .mixin()" vs. ".namespace.mixin()" -
all less documentation , tutorials use #namespace > .mixin() syntax when takes namespaces. find myself more comfortable .namespace.mixin() syntax, i.e.:
.namespace() { .mixin() { foo: bar; } } #usage {.namespace.mixin()}
am missing something? there difference between these 2 variants (in partucular, way mixins/variables affect scope , vice versa)? or kind of historically rooted tradition?
you're right, ".namespace > .mixin", ".namespace.mixin" , ".namespace .mixin" different beasts when used selectors. things seem dissimilar when goes mixin invoke/expansion. cannot craft example where:
"#usage {#namespace > .mixing}" "#usage {#namespace.mixing}" "#usage {#namespace .mixing}"
etc. produce non equal output, assuming .mixin defined parametric ruleset. same ".namespace". e.g.:
/* */ #namespace { .mixin1() { foo1: bar; .mixin1() { foo2: bar; } } .someruleset { foo3: bar; .mixin1 { foo4: bar; } } } /* 1 */ #u1 {#namespace > .mixin1()} /* 2 */ #u2 {#namespace .mixin1()} /* 3 */ #u3 {#namespace.mixin1} /* 4 */ #u4 {#namespace .mixin1} /* 5 */ #u5 {#namespace.mixin1.mixin1()} /* 6 */ #u6 {#namespace.someruleset.mixin1()} /* b */ .namespace { .mixin1() { foo1: bar; .mixin1() { foo2: bar; } } .someruleset { foo3: bar; .mixin1 { foo4: bar; } } } /* 1 */ #u1 {.namespace > .mixin1()} /* 2 */ #u2 {.namespace .mixin1()} /* 3 */ #u3 {.namespace.mixin1} /* 4 */ #u4 {.namespace .mixin1} /* 5 */ #u5 {#namespace.mixin1.mixin1()} /* 6 */ #u6 {#namespace.someruleset.mixin1()}
all 1-6 results seems equal.
i don't know if it's intended less behaviour, "language dark corners" or ... here's why prefer use ".namespace.mixin()" syntax , not "#namespace > .mixin()" (if understand correctly , if way works intended behaviour - assuming "less.js 1.4.x"): strictly speaking, there's no such things "namespace" or "mixin" in less, no more "logical abstractions". there're rulesets can parametric , non-parametric. ruleset can serve namespace, mixin or both depending on way define , invoke it.
so original question two:
- use of ">" (this main concern): if it's redundand when invoking/"calling" mixin (unlike ">" in selectors) - drop it.
- "#" vs. ".": if nested "mixin" can serve namespace (and that's possible if it's defined "dot ruleset") why want declare top-level namespace "#"? in other words, if can use ".ruleset1.ruleset2.ruleset3.ruleset4.etc()" can't "#ruleset1 > #ruleset2 >. etc()" why use latter syntax two-level expansion? (except cases when need mixin inside of id selector).
while writing above, thought better correct original example adding empty parens ".namespace" definition stress fact it's explicitly invokable entity , not selector in way.
.namespace.mixin
refers element both classes while .namespace .mixin
find .mixins in .namespace, or typo?
Comments
Post a Comment