[RFC] LESS CSS

Note: We are moving the topics of this forum and it will be deleted at some point

Publish your own request for comments/change or patches for the next version of phpBB. Discuss the contributions and proposals of others. Upcoming releases are 3.2/Rhea and 3.3.
User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

[RFC] LESS CSS

Post by callumacrae »

LESS is an *awesome* CSS preprocessor that extends CSS hugely, adding variables, mathematical operations, mixins and a lot more useful tools. It makes writing CSS a lot easier.

It uses pretty much exactly the same syntax as CSS itself; it only adds stuff and doesn't change stuff, meaning that existing CSS can be used. This is not a CoffeeScript / HAML equivalent for CSS, this is actually nicer than the language itself.

See http://lesscss.org/ for a tonne of good examples. My favourite features are variables, mixins and nesting, but I'm not a designer - they might find the colour functions very useful (a stylesheet written using LESS CSS with all the colours without each other would certainly be easy to colorize!).


There are a couple LESS CSS compilers for PHP, but I haven't really looked into them yet.


Advantages
  • Adds features to CSS and makes writing CSS very easy - this is a HUGE advantage
  • Can handle minification
Disadvantages
  • Needs to be compiled (but can be cached)
  • May cause some confusion for style authors (but they don't have to use it, and it is very easy to pick up anyway).
Made by developers, for developers!
My blog

User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [RFC] LESS CSS

Post by brunoais »

I'd love to have that! (+1)
Minification is also very useful to reduce bandwidth and increase speed.

I've checked out the php compiler and it seemed like it works correctly.
This can work with normal CSS (just ignores it (?)) so no need to change the current files to use this.
With the php compiler we should be able to compile the .css and place them in the cache everytime the cache is purged.
Using this we can benefit from HTTP cache on .css and this tool.

Anyway I don't like the original idea for LESS. It breaks the rule no. ? of the internet:
Every user of the internet uses javascript
When I accessed that page It only had the original browser styling. I had to turn javascript on to see LESS working.
So, unless the LESS php compiler works correctly, I think we'll be forced to refuse this. (I sure hope the compiler works correctly as it sounds).

About my favorits:
  • Mixins is great for the browser specific CSS (stuff not slenderized when the browsers were released) E.g. border-radius.
  • Variables are great to create relative stuff and some more specific definitions.
    I think this should not replace the ideology of having .icon{...} .icon.big{...}, etc... Having necessary repeated stuff is problematic to maintain and increases processing time.
  • To have what I mentioned before we have the nested rules. This is a great feature to get good results with little code. I love it!!!!
I hope this passes the tests. :D

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: [RFC] LESS CSS

Post by callumacrae »

Minification wasn't the main point of this.

There are multiple PHP compilers - and by the time 4.0 development starts, there will be more. I'm going to find the best one and help develop it.


LESS is a modern technology, and so assumes that users aren't ignorant enough to disable JavaScript. Evidently, they were wrong. Nobody uses the JavaScript library except for demo and development purposes, anyway.



Just remembered: IDEs with code checking built in *hate* LESS. Note the syntax highlighting and errors here:
Image
Made by developers, for developers!
My blog

User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [RFC] LESS CSS

Post by brunoais »

Hum... I didn't remember that. I don't use IDE's to write .css anyway.
Anyway, IDE's (AFAIK) can be programmed so that they ignore CSS errors in .css files

Probably this can be applied in phpbb 3.2 or even, if there's time for testing, in 3.1.
What do you think?

User avatar
VSE
Extension Customisations
Extension Customisations
Posts: 673
Joined: Mon Mar 08, 2010 9:18 am

Re: [RFC] LESS CSS

Post by VSE »

My 2 cents: Use LESS to build the CSS during development. However, compile it and distribute the compiled CSS with phpBB 4.

It isn't fair to ask users to learn yet another coding language. With traditional CSS distributed in phpBB, a casual forum admin should know how to make a tweak to their CSS if needed for some reason. Likewise, MOD/Style authors could code either in CSS, or they could use LESS - maybe the MOD installation (AutoMOD) system could compile LESS into CSS if the developer chose to use LESS.
Has an irascible disposition.

User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [RFC] LESS CSS

Post by brunoais »

VSE+ wrote:My 2 cents: Use LESS to build the CSS during development. However, compile it and distribute the compiled CSS with phpBB 4.

It isn't fair to ask users to learn yet another coding language. With traditional CSS distributed in phpBB, a casual forum admin should know how to make a tweak to their CSS if needed for some reason. Likewise, MOD/Style authors could code either in CSS, or they could use LESS - maybe the MOD installation (AutoMOD) system could compile LESS into CSS if the developer chose to use LESS.
I'm actually talking about implementing this system (the LESS for CSS) as an addition to the caching system to parse and prepare (maybe merge) .css files. It can mean that that prosilver is shipped with it already compiled. But it gives the opportunity/freedom to template developers to use this simplifier while writing their CSS. You should note that passing regular standards compliant CSS to this compiler results in exactly the same code so... What do we have to lose?

User avatar
callumacrae
Former Team Member
Posts: 1046
Joined: Tue Apr 27, 2010 9:37 am
Location: England
Contact:

Re: [RFC] LESS CSS

Post by callumacrae »

VSE+ wrote:My 2 cents: Use LESS to build the CSS during development. However, compile it and distribute the compiled CSS with phpBB 4.

It isn't fair to ask users to learn yet another coding language. With traditional CSS distributed in phpBB, a casual forum admin should know how to make a tweak to their CSS if needed for some reason. Likewise, MOD/Style authors could code either in CSS, or they could use LESS - maybe the MOD installation (AutoMOD) system could compile LESS into CSS if the developer chose to use LESS.
You don't need to learn LESS to be able to read LESS. it is mind-numbingly easy, and the syntax is obvious :-)
Made by developers, for developers!
My blog

User avatar
brunoais
Registered User
Posts: 964
Joined: Fri Dec 18, 2009 3:55 pm

Re: [RFC] LESS CSS

Post by brunoais »

callumacrae wrote: You don't need to learn LESS to be able to read LESS. it is mind-numbingly easy, and the syntax is obvious :-)
+1
Unless you use complex stuff LESS allows, including using the & as a suffix or infix. I think it should only be used as a preffix.
Last edited by brunoais on Thu Feb 23, 2012 1:07 pm, edited 1 time in total.

User avatar
Arty
Former Team Member
Posts: 985
Joined: Wed Mar 06, 2002 2:36 pm
Location: Mars
Contact:

Re: [RFC] LESS CSS

Post by Arty »

It does look very useful

ecwpa
Registered User
Posts: 181
Joined: Mon Jan 24, 2005 2:10 am
Contact:

Re: [RFC] LESS CSS

Post by ecwpa »

I like this idea. I was thinking about Bootstramp but thats way more restrictive. With LESS you can have a CSS file just for defining colors, a dream for me to be honest.
Slightly better English than it was in 2005, still improving :D

Post Reply