Use LESS CSS for creating iUI CSS stylesheets

[GoogleCodeExporter]

Use lesscss.js to generate iUI and theme CSS stylesheets.  This will make it 
much easier for the development team to maintain multiple stylesheets and for 
end users to customize them.

iUI should support all 3 ways of generating CSS from LESS:
1) Command-line tool as part of the iUI build
2) Client-side conversion using lesscss.js
3) Server-side conversion for localhost test server during development

Original issue reported on code.google.com by msgilli...@gmail.com on 27 Mar 2012 at 2:17

[GoogleCodeExporter]

See http://lesscss.org/

Original comment by msgilli...@gmail.com on 27 Mar 2012 at 2:18

[GoogleCodeExporter]

Here's a proof-of-concept for method #1 (command-line generation):
http://code.google.com/r/msgilligan-iui-dev/source/detail?r=589f247407542c3dba90
98c5082a983e6e880083

Checkout out the above revision and use:
./gradlew lessCompile
to generate CSS output files in the following locations:
target/<iui-version>/web-app/iui/iui-from-less.css
and
target/<iui-version>/web-app/iui/t/default/default-theme-from-less.css

Original comment by msgilli...@gmail.com on 27 Mar 2012 at 2:36

• Changed state: Started

[GoogleCodeExporter]

Issue 339 has been merged into this issue.

Original comment by msgilli...@gmail.com on 22 Jul 2012 at 8:46

[GoogleCodeExporter]

The lessframework.com project has a nice build system as well, and an 
interesting development model.  It isn't actively maintained far as I can tell. 
 It uses a very interesting concept whereby you don't compile ... it compiles 
dynamically.  When you've completed your development cycle, you disable the 
"dev" mode, and take the final generated CSS to use in your production project. 
 I did an experiment a year or so ago to incorporate the lessframework approach 
into a mobile oriented set of stylesheets for my own project.  Let's have a 
look at their approach.  What I like is that it did not require any new 
learning (just LESS) and no new build system to compile anything. 

Original comment by dko...@gmail.com on 8 Aug 2012 at 12:11

[GoogleCodeExporter]

I think this is the big feature for your next big release, because this lets 
you open up to contributions from platform/stylesheets that you don't actively 
support.  In fact, you might end up taking in sheets into a contrib dir that 
aren't tested as part of the regular release, but that make sense for sharing 
to the wider community.

Original comment by dko...@gmail.com on 8 Aug 2012 at 12:13

[GoogleCodeExporter]

"I think this is the big feature for your next big release, because this lets 
you open up to contributions from platform/stylesheets that you don't actively 
support.  In fact, you might end up taking in sheets into a contrib dir that 
aren't tested as part of the regular release, but that make sense for sharing 
to the wider community."

It's like you read my mind.  Part of this comes from my own experience of 
adding iPad (aka split-screen) support.

Original comment by msgilli...@gmail.com on 8 Aug 2012 at 6:34

[GoogleCodeExporter]

lessframework.com???  It seems unrelated to LESSCSS and it has no build system 
that I can see just a handful of .css files.

Original comment by msgilli...@gmail.com on 8 Aug 2012 at 6:37

[GoogleCodeExporter]

Ooops, wrong site.  Flawless: https://github.com/DominikGuzei/flawless.css

Not well maintained.  But interesting concept.

Original comment by dko...@gmail.com on 8 Aug 2012 at 6:52

[GoogleCodeExporter]

I did want to make good use of .mixins in the iUI less - we can't start out at 
0kb like flawless, but the mixins will make things pretty customizable.

We'll need a command-line build script no matter what we do because we'll want 
to ship a prebuilt version of iUI that includes the .css files so people that 
don't know LESSCSS don't have to touch it.  But if you want to make a 
client-side script to create .css in a window like flawless does, that would be 
really cool.

Original comment by msgilli...@gmail.com on 8 Aug 2012 at 8:42

[GoogleCodeExporter]

Might make sense to have a "designer" mode using flawless, but otherwise, it's 
off and not shipped with the minified versions/package that gets deployed.  
Anyway, I did start prototyping something with this awhile back, but would be 
good to start with a goal like iUi in mind (I was starting from scratch 
previously).

Original comment by dko...@gmail.com on 9 Aug 2012 at 7:57

[GoogleCodeExporter]

Have you looked at the LESS CSS branch that I made?

It's also interesting to plug iUI into http://css2less.cc/ and see what happens.

Once we get the basics working, if it's not too much work, I'd love to see a 
quick branch with some kind of "designer" mode.  I've been thinking of 
something more in line with the Twitter Bootstrap web form -- where you'd make 
a few choices in a form and then download a custom zip.

Original comment by msgilli...@gmail.com on 11 Aug 2012 at 6:03