-
-
Save anthonyshort/3862882 to your computer and use it in GitHub Desktop.
| @module grid { | |
| $columns: 12; | |
| $gutter: 30px; | |
| $baseline: 20px; | |
| $width: 60px; | |
| @function columns($n, $size) { | |
| } | |
| @function baseline($n) { | |
| } | |
| @mixin columns($n) { | |
| } | |
| @mixin container { | |
| } | |
| @mixin classes { | |
| @for $i from 1 through $columns { | |
| // ... | |
| } | |
| } | |
| } | |
| // Set variables | |
| grid::$columns: 16px; | |
| // Include some grid classes | |
| @include grid::classes; | |
| .container { | |
| @include grid::container; | |
| } | |
| .posts { | |
| @include grid::columns(5); | |
| height: grid::baseline(2); | |
| } |
| @module anthony { | |
| $size: 5px; | |
| @mixin make-awesome($size) { | |
| border-radius: $size; | |
| } | |
| } | |
| #id { | |
| @include anthony::make-awesome; | |
| height: anthony::$size; | |
| } |
Im pretty sure I had this idea first
- How would extend and placeholders work with this?
- How would it work with css selectors. One idea is to allow sass to expose a prefix that is specified by the @import directive. This gives users the ability to import third-party css into an existing project without worrying about css class/id collisions.
- Would extend directives cross module boundaries? Seems like it must in some way -- how to specify?
- How can this solve the "this .last class has a completely different meaning than this other .last class" problem for @extend?
- Repeatedly typing
compass::would suck. It seems like some way to add constants to the default scope would be needed. - I'm not sure about
::, but I'm not sure what would be a better syntax. Why did you pick::is it a ruby influence? - I'm surprised you used
anthony::$sizeinstead of$anthony::size. Why did you pick the syntax you did?
Firstly, I would mainly see @module as being solely for mixins and variables. The main problem I was trying to address was with organisation and modularisation of mixins in large projects with many external sass libraries. That means there shouldn't be any issues with using @extend. A mixin within a module can @extend with an !optional call if needed.
So I suppose my main concern here is for libraries.
How would extend and placeholders work with this?
Selectors can't be placed inside of modules. Placeholders, possibly. But then using them would require a namespace @extend anthony.clearfix; or something. It wouldn't really work I don't think.
How would it work with css selectors.
No selectors allowed in there.
Repeatedly typing compass:: would suck
Would it be possible to include a module in the root scope and have access to those mixins locally?
@import compass;
#id {
@include border-radius(5px);
}Although I don't want this turning into PHP with namespace hell.
Why did you pick :: is it a ruby influence?
Yep. Figured the whole mixin thing is similar to Ruby.
I'm surprised you used anthony::$size instead of $anthony::size
I thought you were making a joke then :) anthony::$size for consistent use of the namespace. $anthony::size looks like a variable called anthony::size. Whereas anthony::$size looks more like a variable of a module to me.
Wondering if anything like this has been discussed before?
Libraries are starting to become more widespread, being able to namespace them provides a number of benefits:
That's only two reasons... but you see my point.