3

My original problem was linking multiple stylesheet frameworks. My primary option was Materialize and for reasons, i'd like to integrate Bootstrap on some buttons and other components. After hours of desperate research, i found myself staring at css pre-processors, e.g. LESS and SASS. I found out that you can do dynamic css using these badasses.

Investing a couple more hours deciding which to use, I ended up failing to install both.

So far I managed to download bootstrap sass and integrated it inside my project and compiled it using grunt (follow this instruction). I don't know how to use it and where to start.

I found some cool references here but it was not enough to get me going.

.bootstrap {
    @import "/bootstrap.less"
}

I have so my follow up questions to the post:

  1. should I link the less file on my index.php?
  2. can I use any editor and compile the less with any less compiler?
  3. should i link the compiled less or the created css?
  4. do I even need to use LESS for this?

Note: I'm a total newbie with LESS and SASS. Any information is a ++.

Community
  • 1
  • 1
Hard Spocker
  • 765
  • 11
  • 32

1 Answers1

0

I personally prefer Sass and I use it a lot even for small CSS stylesheets!

Here you are my answer:

  1. Absolutely not! A less file is not intended for browser parsing. It is intended only for development purpose, that is to produce one or more .css file.
  2. Feel free to use any editor you prefer and compile with any compiler you prefer. For example, I use Scout-App for Sass.
  3. You must link only .css produced files.
  4. It depends on your project and/or your needs. LESS and Sass are very similar.

Other tips for you: Install on your CodeIgniter app an asset helper, and in asset folder place your css and less files. See the directory structure below:

application
system
user_guide
assets
--css
--less
--js
--img
ecc...

Put your less file separated from your css file. Link css file with the asset helper and you will have autoupdatable style!

If you use Git, remember to ignore css folder and track less or sass folder.

I hope you can find these tips helpful!

UPDATE: It's a shame that no one answer to this question in time!

Marco Consiglio
  • 133
  • 2
  • 7