SteB
SteB

Reputation: 2007

Compiling Bootstrap from LESS, missing rules

I'm compiling Bootstrap from the latest LESS files so I can override/add my own variables (mostly colours).

However the compiled css file doesn't contain any of the .span3, .span8 rules, does anyone know how/where these rules are generated?

Downloading the latest pre-compiled css files works fine - these contain the above rules.
I've tried a search on the LESS files, but only the table rules were found (.tableColumns(3), .tableColumns(8) etc..).

My current bootstrap.less looks like:

@import "@{BootStrapVer}/variables.less";
@import "@{Custom}/custom-vars.less";
@import "@{BootStrapVer}/mixins.less";

<Rest of bootstrap less files excluded for brevity>

Upvotes: 1

Views: 1719

Answers (2)

SteB
SteB

Reputation: 2007

I originally thought the issue was to do with adding in my custom less files.

Thanks to David Taiaroa's reply and some more debugging, a new version of Prepos and comparing to the output of WinLESS, I eventually determined that it's the settings I was using in Prepos.

Unselecting "Strict Maths" and "Strict Units" and re-compiling produced the correct CSS files.

Upvotes: 1

David Taiaroa
David Taiaroa

Reputation: 25495

If I understand your description correctly, you are wanting a single, standalone CSS file which includes both the Bootstrap defaults plus your customisation.

Start by getting a copy of the less files from https://github.com/twitter/bootstrap/archive/master.zip

If you open boostrap.less you will see that towards the top there is

// Core variables and mixins
@import "variables.less"; // Modify this for custom colors, font-sizes, etc
@import "mixins.less";
....

add a statement calling your custom variable file in the middle of this block, being sure to get the relative path correct. Eg

// Core variables and mixins
@import "variables.less"; // Modify this for custom colors, font-sizes, etc  
@import "../../relative/path-to/custom-vars.less";
@import "mixins.less";  

Then compile bootsrap.less.

I agree with @ScottSimpson, CodeKit is a good Mac option.

good luck!

Upvotes: 1

Related Questions