Node is currently one of those rare packages that are easier to build from source rather than from deb binaries.

apt-get update
apt-get install build-essential g++
cd /usr/local/src
tar xzf /tmp/node-v0.8.2.tar.gz
cd node-v0.8.2
./configure --without-ssl
make -j4
make install

will put node in /usr/local/{bin,lib,include,share/man}.

cd /tmp
tar xzf /tmp/cloudhead-less.js-v1.0-558-g5974b9e.tar.gz
mv /tmp/cloudhead-less.js-5974b9e /usr/local/lib/node_modules/lessjs
cd /usr/local/bin
ln -s ../lib/node_modules/lessjs/bin/lessc

will make the less compiler available in /usr/local/bin.

Now you can

lessc less/mybootstrap.less css/mybootstrap.css

and

lessc -x less/mybootstrap.less css/mybootstrap.min.css
Advertisements

In HTML, if you want to render a block of code, respecting white-space, but without any hyperlinking or other HTML, it’s easy; just use code. Secondly, if you want to have hyperlinks within your code then there are several options, including placing each line within a li of a list. Thirdly, if you want to render it with intelligent syntax highlighting, there are syntax highlighters from Google and others. But what if you want to combine the first two? Have a code block that respects white-space like indents and line-breaks but also includes HTML? Here we look at one solution.

CSS

div.code-linkable {
  background-color: #f7f7f7;
  border-radius: 4px;
  color: #44443c;
}
.code-linkable > ol {
  font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
  list-style-type: none;
  padding: 7px;
  text-shadow: none;
}
.code-linkable > ol > li {
  white-space: pre-wrap;
}

HTML

<div class="code-linkable">
  <ol>
    <li>SELECT</li>
    <li>  iOrderId</li>
    <li>FROM</pre>
    <li>  <a href="/schema_browser?schema=Orders&table=tOrder">
        Orders.tOrder</a>
    <li>WHERE</li>
    <li>  fGross &gt; 100.00</li>
  </ol>
</div>

As you can see with the greater-than symbol, a disadvantage is that everything ambiguous must be html-ified. If you want a distinct background colour for the code block, do that in a wrapping div since list items have varying lengths (widths).