Cool. I haven't seen this one before. Since it was fairly simple I reimplemented it in Clojure with Garden. *Here's the gist.*<https://gist.github.com/noprompt/5873715>
I took a functional approach using higher order functions. It could be a little cleaner but then again *the arithmetic isn't all on one 168 character line either*<https://github.com/twigkit/semantic.gs/blob/master/stylesheets/scss/grid.scss#L63>. There are a few refactorings and nearly all of it is documented in a literate programming style. On Wednesday, June 26, 2013 5:41:56 AM UTC-7, Rob Jens wrote: > > Hey Jeremy, > > You might be interested, in case you hadn't heard of it yet, of the > Semantic Grid (http://semantic.gs) probably in particular their Stylus > version > https://github.com/twigkit/semantic.gs/blob/master/stylesheets/styl/grid.styl > but > depending on your taste/clarity might also wish to check out their grid in > Sass/SCSS. > > Its math is quite elegant and simple. > > Cheers, > Rob > > Op woensdag 19 juni 2013 13:14:03 UTC+2 schreef JeremyS het volgende: >> >> Hi Joel, >> >> Thank for the interest ! You can also take a look at some code have done >> around css unit types there <https://github.com/JeremS/units>. It's got >> arithmetic for >> units and a namespace dedicated to colors. In it you'll find conversions >> between rgb en hsl (that I have taken from the color >> library<https://github.com/jolby/colors> >> ) >> and the implementation of SASS color helpers. May be you could adapt my >> library to garden. From what I have seen Garden uses >> protocols to compile different types into css and every unit (including >> colors) I define is a record. So you might be able to extend my library >> with Garden protocols and use it in garden without much effort. I'd be glad >> to see that ! >> >> About higher order function I have thought about that and went back, my >> first approach made for to complicated function (complected even). With the >> actual implementation I can just define stuff like: >> >> (def grid {}) ; grid spec with column, gutter... >> >> (def width (partial grid/witdh grid)) >> (def push (partial grid/push grid)) >> >> >> and then : >> >> (def side-style [:#side (width 4) >> (push 1)]) >> >> for a side element spanning onto 4 columns and pushed off 1. >> >> >> Regarding more advanced systems like Foundation I haven't spent much time >> trying to implement them with my DSL. >> To do so I need to up my CSS game because I am not yet well versed into >> the art of responsive design and it will take me >> a bit of time wrapping my head around the media queries involved. If I >> try to got responsive, I might probably study >> the Unsemantic <http://unsemantic.com> system from the creator of the >> 960 one I think. >> >> Good luck with your work and don't hesitate on browsing my github, right >> now most of the projects are oriented around CSS and there >> might be some ideas there who knows ! >> >> On Wednesday, June 19, 2013 8:54:48 AM UTC+2, Joel Holdbrooks wrote: >>> >>> Jeremy, >>> >>> Looks good. I've been tinkering with grid systems on and off for the >>> past month or so. Have you thought of trying your hand at porting something >>> like the Foundation or Gumby grid system? >>> >>> One thing I've discovered, and you might try this with your 960 >>> implementation, is that using higher order functions can be very handy for >>> building them out. For example, a *make-grid* function which accepts a >>> map of configuration options and returns a function which takes a column >>> number and optional parameters for, say, push and pull. It's a nice way to >>> package things up. >>> >>> I'm close to wrapping up a small colors framework for Garden which will >>> be available in the next beta (hopefully it won't be in beta much longer). >>> When I take it out of beta it'll probably include a Clojure flavored >>> implementation of either the grid system that ships with Bootstrap or >>> Foundation (including the mobile parts). >>> >>> On the side I've been taking of advantage of Clojure to create a new >>> concept for a *layout* system. It's based on the font-size/line-height >>> ratio and allows for the construction of stylesheets such that the grid >>> system and typography are harmonious. IOW it's a fat pain in the ass, but I >>> don't think I could even fathom the idea of doing it in Sass. >>> >>> TL;DR you have Clojure at your disposal! Though we're SOL on some very >>> nice Sass libraries, we can potentially do more and at a higher level! >>> >>> Thanks for sharing! It's inspiring. >>> >>> On Jun 18, 2013, at 4:41 AM, JeremyS <jschof...@gmail.com> wrote: >>> >>> Hi Joel, >>> >>> I have a quick and dirty implementation of a 960-ish grid >>> system<https://github.com/JeremS/cljss-grid>using a DSL similar to garden >>> If you want to take a look. >>> >>> >>> >>> On Friday, April 26, 2013 1:01:44 AM UTC+2, Joel Holdbrooks wrote: >>>> >>>> It's funny you should bring that up! I've actually been working on >>>> extracting the grid system from Bootstrap and modular scale from >>>> Foundation. But it's mostly been tinkering. >>>> >>>> * I am sorely tempted to give this a try.* >>>> >>>> Please do! If I come up with something I'll be sure to share a Gist. >>>> >>>> >>>> On Thu, Apr 25, 2013 at 3:27 PM, Clinton Dreisbach <cli...@dreisbach.us >>>> > wrote: >>>> >>>>> One interesting thing you could do, given both Garden and >>>>> ClojureScript, is package CSS frameworks like Twitter Bootstrap or >>>>> Zurb Foundation as a Clojure library. I am sorely tempted to give this >>>>> a try. >>>>> >>>>> On Thu, Apr 25, 2013 at 6:12 PM, Joel Holdbrooks <cjhold...@gmail.com> >>>>> wrote: >>>>> > Murtaza, >>>>> > >>>>> > Thanks for having a look at the library. I'll try to answer you >>>>> questions as >>>>> > best as I can. >>>>> > >>>>> > >>>>> > How does Garden compare to other pre processors such as sass and >>>>> less? >>>>> > >>>>> > There are some similarities with Garden and other CSS preprocessors. >>>>> I've >>>>> > tried to bring over the ones I found most useful when using them. >>>>> Nested >>>>> > selectors and declarations, parent selector references, and unit >>>>> arithmetic >>>>> > are all currently available to stylesheet authors. >>>>> > >>>>> > The big difference and, in my opinion, the big win is you can build >>>>> your >>>>> > stylesheets with regular Clojure. This gives you a lot of power and >>>>> freedom >>>>> > you won't find anywhere else (AFAIK). To name just a few benefits: >>>>> > >>>>> > There's no file parsing or interpretation step. It's just data >>>>> > transformation. >>>>> > There's no need for any sort of special @mixin syntax or macros, you >>>>> can use >>>>> > Clojure function. >>>>> > There's no need for an @include directive thanks to clojure >>>>> namespaces. This >>>>> > can help you organize your stylesheet in ways (I think) are much >>>>> cleaner and >>>>> > less surprising than SASS and other preprocessors. >>>>> > Thanks to Clojure, Garden (potentially) has clearer syntax than CSS >>>>> which, >>>>> > if you look closely, can be pretty random in some places. >>>>> > >>>>> > WIth regard to the third point, if you've ever tried using the SMACSS >>>>> > approach to stylesheet authoring with a preprocessor like SASS, you >>>>> can end >>>>> > up with an explosion of files and tons of @include directives. It's >>>>> not fun, >>>>> > it's hard to manage, and it's difficult to see where code is coming >>>>> from - >>>>> > especially when using 3rd-party libraries. >>>>> > >>>>> > Also can I use it in my clojurescript projects ? I mean does it have >>>>> any >>>>> > java lib dependencies that would prevent it? >>>>> > >>>>> > It does have one small dependency on java.net.URI but I need some >>>>> time to >>>>> > think about whether or not it would be worth dropping. As far as >>>>> using it >>>>> > from a ClojureScript project, what sort of use case are you >>>>> considering? >>>>> > >>>>> > What is the workflow when using Garden? >>>>> > >>>>> > My experience using Garden is probably close to others at this >>>>> point. It's >>>>> > kind of funny in that regard. I'm building a tool and at the same >>>>> time am >>>>> > learning how to use it. Personally, I create a namespace for my >>>>> "core" >>>>> > stylesheets and separate namespaces for things like utilities and so >>>>> forth >>>>> > (ie. (ns me.css (:require [me.css.button :as button])) . Then I have >>>>> a call >>>>> > to function that compiles and saves the stylesheet at the bottom of >>>>> the >>>>> > "core" stylesheets. Since I develop with Emacs and nREPL this means >>>>> all I >>>>> > have to do is reload the file and the CSS is "refreshed". >>>>> > >>>>> > It isn't the best approach, but Garden is still very young and I >>>>> haven't >>>>> > thought about how a standardize the build process. But I would >>>>> definitely be >>>>> > open to any thoughts regarding that. A Leiningen plugin would be >>>>> awesome! >>>>> > >>>>> > >>>>> > I hope these answers are helpful. Please continue to experiment with >>>>> the >>>>> > library and express your thoughts! >>>>> > >>>>> > Thanks, >>>>> > >>>>> > Joel >>>>> > >>>>> > >>>>> > On Wed, Apr 24, 2013 at 6:44 PM, Murtaza Husain >>>>> > <murtaza...@sevenolives.com> wrote: >>>>> >> >>>>> >> Joel, >>>>> >> >>>>> >> Thanks for the lib. Its great and I plan to use it in my projects. >>>>> >> >>>>> >> How does Garden compare to other pre processors such as sass and >>>>> less ? >>>>> >> >>>>> >> Also can I use it in my clojurescript projects ? I mean does it >>>>> have any >>>>> >> java lib dependencies that would prevent it? >>>>> >> >>>>> >> What is the workflow when using Garden ? If I am using Sass, I would >>>>> >> create a .scss file, and the sass daemon would watch over any >>>>> changes to the >>>>> >> file and compile it to .css. >>>>> >> >>>>> >> As I understand garden is generating css when called with the >>>>> fn/macro >>>>> >> (css [...]). Would it make sense to have a similar workflow like >>>>> above; >>>>> >> where a leiningen plugin watches for any .garden files and compiles >>>>> them to >>>>> >> .css files ? Or is there a better workflow that I am missing? >>>>> >> >>>>> >> Thanks, >>>>> >> Murtaza >>>>> >> >>>>> >> >>>>> >> On Tuesday, April 23, 2013 2:42:55 AM UTC+5:30, Joel Holdbrooks >>>>> wrote: >>>>> >>> >>>>> >>> As of today, Garden is officially out of alpha and in to beta! >>>>> >>> >>>>> >>> The library now sports media queries (via meta data) and parent >>>>> selector >>>>> >>> references (ie. "&hover"). With these new features it is now >>>>> possible to >>>>> >>> build more sophisticated stylesheets bringing us a step closer to >>>>> having a >>>>> >>> viable CSS alternative in Clojure. >>>>> >>> >>>>> >>> Over the course of the next few weeks, I plan to continue >>>>> improving the >>>>> >>> library by adding "missing" features and functions to make the >>>>> library as >>>>> >>> powerful as possible when it's release as 0.1.0 stable. >>>>> >>> >>>>> >>> Now more than ever, I would like to encourage others in the >>>>> community to >>>>> >>> reach out with suggestions and code review. This my first "real" >>>>> Clojure >>>>> >>> library and after only six months with the language I'm sure it >>>>> could >>>>> >>> benefit greatly from both of these things. >>>>> >> >>>>> >> -- >>>>> >> -- >>>>> >> You received this message because you are subscribed to the Google >>>>> >> Groups "Clojure" group. >>>>> >> To post to this group, send email to clo...@googlegroups.com >>>>> >> Note that posts from new members are moderated - please be patient >>>>> with >>>>> >> your first post. >>>>> >> To unsubscribe from this group, send email to >>>>> >> clojure+u...@googlegroups.com >>>>> >> For more options, visit this group at >>>>> >> http://groups.google.com/group/clojure?hl=en >>>>> >> --- >>>>> >> You received this message because you are subscribed to a topic in >>>>> the >>>>> >> Google Groups "Clojure" group. >>>>> >> To unsubscribe from this topic, visit >>>>> >> >>>>> https://groups.google.com/d/topic/clojure/xbFU2prTxlY/unsubscribe?hl=en >>>>> . >>>>> >> To unsubscribe from this group and all its topics, send an email to >>>>> >> clojure+u...@googlegroups.com. >>>>> >> >>>>> >> For more options, visit https://groups.google.com/groups/opt_out. >>>>> >> >>>>> >> >>>>> > >>>>> > >>>>> > >>>>> > >>>>> > -- >>>>> > >>>>> > Joel >>>>> > >>>>> > -- >>>>> > -- >>>>> > You received this message because you are subscribed to the Google >>>>> > Groups "Clojure" group. >>>>> > To post to this group, send email to clo...@googlegroups.com >>>>> > Note that posts from new members are moderated - please be patient >>>>> with your >>>>> > first post. >>>>> > To unsubscribe from this group, send email to >>>>> > clojure+u...@googlegroups.com >>>>> > For more options, visit this group at >>>>> > http://groups.google.com/group/clojure?hl=en >>>>> > --- >>>>> > You received this message because you are subscribed to the Google >>>>> Groups >>>>> > "Clojure" group. >>>>> > To unsubscribe from this group and stop receiving emails from it, >>>>> send an >>>>> > email to clojure+u...@googlegroups.com. >>>>> > For more options, visit https://groups.google.com/groups/opt_out. >>>>> > >>>>> > >>>>> >>>>> -- >>>>> -- >>>>> You received this message because you are subscribed to the Google >>>>> Groups "Clojure" group. >>>>> To post to this group, send email to clo...@googlegroups.com >>>>> Note that posts from new members are moderated - please be patient >>>>> with your first post. >>>>> To unsubscribe from this group, send email to >>>>> clojure+u...@googlegroups.com >>>>> For more options, visit this group at >>>>> http://groups.google.com/group/clojure?hl=en >>>>> --- >>>>> You received this message because you are subscribed to a topic in the >>>>> Google Groups "Clojure" group. >>>>> To unsubscribe from this topic, visit >>>>> https://groups.google.com/d/topic/clojure/xbFU2prTxlY/unsubscribe?hl=en >>>>> . >>>>> To unsubscribe from this group and all its topics, send an email to >>>>> clojure+u...@googlegroups.com. >>>>> For more options, visit https://groups.google.com/groups/opt_out. >>>>> >>>>> >>>>> >>>> >>>> >>>> -- >>>> >>>> Joel >>>> >>> >>> -- >>> -- >>> You received this message because you are subscribed to the Google >>> Groups "Clojure" group. >>> To post to this group, send email to clo...@googlegroups.com >>> Note that posts from new members are moderated - please be patient with >>> your first post. >>> To unsubscribe from this group, send email to >>> clojure+u...@googlegroups.com >>> For more options, visit this group at >>> http://groups.google.com/group/clojure?hl=en >>> --- >>> You received this message because you are subscribed to a topic in the >>> Google Groups "Clojure" group. >>> To unsubscribe from this topic, visit >>> https://groups.google.com/d/topic/clojure/xbFU2prTxlY/unsubscribe. >>> To unsubscribe from this group and all its topics, send an email to >>> clojure+u...@googlegroups.com. >>> For more options, visit https://groups.google.com/groups/opt_out. >>> >>> >>> >>> >>> -- -- You received this message because you are subscribed to the Google Groups "Clojure" group. To post to this group, send email to clojure@googlegroups.com Note that posts from new members are moderated - please be patient with your first post. To unsubscribe from this group, send email to clojure+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/clojure?hl=en --- You received this message because you are subscribed to the Google Groups "Clojure" group. To unsubscribe from this group and stop receiving emails from it, send an email to clojure+unsubscr...@googlegroups.com. For more options, visit https://groups.google.com/groups/opt_out.
