This is the discussion thread for my LESS extension.
The extension allows you to use Agar’s amazing less.php compiler to compile LESS into CSS in your Yii-application. It also allows for compiling the LESS before each request, which is very handy in development environments.
What is LESS?
LESS is a dynamic stylesheet language which supports variables, mixins, nested rules, functions, etc. If you haven’t tried LESS you should definitely give it a go, you won’t be disappointed.
I use both extensions together on multiple projects and my setup is as follows:
I don’t call Yii::app()->boostrap->registerBootstrap(); in my main layout (because I don’t want to include the bootstrap css file). Instead I’ve configured the less compiler to compile less/styles.less to css/styles.css and include styles.css in my main layout. On the first line in my styles.less file I include the bootstrap.less:
However, there is still a minor issue in the less.php compiler so you will need to remove the following comment from the bootstrap/lib/reset.less file:
/* Reset.less
* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
This is because the compiler has an issue with parsing long comments so you won’t be able to compile Bootstrap. I’ve reported this issue and the author should fix this soon.
Hopefully this helps. Please don’t hesitate to ask if you have further questions.
This is because of an outdated version of the less/less.php library. The last update of the library was 4 month ago so i don’t think that there will be an update?
Hmm this issue still isn’t been solved. I just wanted to start using the bootstrap extension with the less php class. How do you solving this issue? i tried to compile the less code with simpleless but this doesn’t work at all.
@sebako look if you have the correct names
you are using
/css/style(s).less
and ‘less/style.less’=>‘css/style.css’, in your config without the (s).
Hey dude. I did what was told on setup instructions but i can’t make it work. There is another setup action to do besides those described on extension page?
I got the same problem, the current phpless version can not parse the LESS used in Bootstrap 2.0.2, you have to use 2.0.1 with the current lessCompiler.
So I tried to integrate lessphp by leafo, but with my very limited exposure to Yii I guess it’s not great - it works.
I don’t yet understand caching in Yii so I’m not sure if it could be done better that way. Also as I understand it, the protected folder isn’t writeable so writing .less.cache files and compiling .less from extensions etc wouldn’t work with lessphp’s inbuilt caching.
The only method I could come up with by myself was to use the webroot/css directory to store the compiled css and cache files. I added lessc.in.php and my LessCss.php to extensions/less and used Yii’s method to hash the names so extensions wouldn’t clash. I’d love to know how what I’ve done should be done if anyone has the time?
I’ve changed a couple of things just to make it work like I want with Bootstrap, and since the extension (well, the lessCompiler.php) didn’t look correctly for files in the directory recursively (or it didn’t work for me)
In main.php, path option I have the files wrapper of Bootstrap:
Hi - I’m sure I’m missing something simple but I’ve been working on this for hours and not even sure if I’m approaching it the correct way.
I want to make changes to bootstrap and hacking the css doesn’t seem like a smart idea as versions will change often. I’m using your bootstrap extension and have just now implemented your less extension.
To start with I just want to modify the navigation bar but eventually will edit more.
The less compiler is working correctly but I’m pretty sure I’m not putting the right things in the style.less file. I basically added the variables.less and navbar.less . When I compile it I see the style.css and it looks correct to me but when I refresh the page it 's exactly the same and nothing has changed.
I guess the extension includes the bootstrap.css and I should force it to use mine instead of maybe as well as? Not to sure how to progress now so any help would be appreciated.
Thanks
Lux
PS: Something else I’m sure is obvious but I’m missing is how is this making things more efficient? I guess I still have to include the bootstrap.css and now it looks like I have to also include the style.css which just duplicates much of the bootstrap.css with some modifications. What’s the point? What am I missing?
UPDATE: I just noticed the comment from Chris about not including bootstrap core with bootstrap by setting it to false in the bootstrap config which I’ve done so now everything is included in styles.css and my navigation changes are showing. Still not seeing the point other than I was able to use variables to change style sheet values easily.