LESS: Unrecognized input error when using Bootstrap

css twitter-bootstrap less harp
Jorge Pedret picture Jorge Pedret · Oct 24, 2013 · Viewed 17k times · Source

After upgrading Harp, I started getting an Unrecognized Input error in an irrelevant line of CSS.

Less -> CSS (Unrecognised input) /Users/jorge/Dropbox/harp.io/apps/mysite.com/public/css/main.less

Using Bootstrap v2.2.2 and Harp v0.9.4.

Answer

Jorge Pedret picture Jorge Pedret · Oct 24, 2013

After digging for a while, I found that the error was coming from the mixin.less file where the #grid stuff was getting defined.

This is what the file had originally:

(~".span@{index}") { .span(@index); }

After reading the LESS change log, I found that they changed the syntax so you can now use variables directly without needing the ~ hack. So I changed my mixin.less to look like this:

.span@{index} { .span(@index); }

There are a couple of other lines that you need to change, but they all follow the same format.

(~".offset@{index}") { .offset(@index); } changes to → .offset@{index} { .offset(@index); }

Related questions

Correct way to create rounded corners in Twitter Bootstrap

I've just started with Twitter Bootstrap and here is one question. I am creating custom <header> block, and I want it's bottom corners to be rounded. Is there any "correct" way to do this by using predefined classes, …

Read More
Use table row coloring for cells in Bootstrap

Twitter Bootstrap offers classes to color table rows like so: <tr class="success"> I like the color choice and the class naming. Now what I would like to do, is to re-use these classes and apply them on …

Read More
Fluid Container in Bootstrap 3

How to make fluid container in bootstrap 3? In bootstrap 2.3.2 .container-fluid class is there. But now in bootstrap 3 it is missing and there is only .container class. Please help me.

Read More