less

I am trying to get Bootstrap's Less files working with Sinatra AssetPack , but I am getting Less parser errors. These errors lead me believe that the less files being imported through bootstrap.less are not aware of each other. I have an app.rb file: require 'sinatra/base' require 'sinatra/assetpack' class App < Sinatra::Base set :root, File.dirname(__FILE__) register Sinatra::AssetPack assets do css :bootstrap, [ '/css/bootstrap.css' ] end get '/' do erb :index end # start the server if ruby file executed directly run! if app_file == $0 end I've copied all of the Bootstrap less files into the

well, I was quite surprised when installing Web Essentials 2015 for Visual Studio 2015 that it didn't include a less compiler anymore: "Web Essentials 2015 no longer contains features for bundling and minifying of JS, CSS and HTML files as well as compiling LESS". Everything worked fine before with Visual Studio 2013. So I downloaded Web Compiler 2015, as it is the new compiler from Mads Kristensen. But, after adding all the needed files to be compiled to the compilerconfig.json, I have an error on compilation that it doesn't recognize my variables anymore nor my mixins! Here's my site.less: /

I want to have 3 buttons across a row in Bootstrap 3, but when it changes to the xs grid, stack them vertically. I'd like to introduce some spacing (margin) between the buttons - but only when the buttons are stacked vertically. Can I do this in LESS? <div class="row"> <div class="col-sm-4 btn-vert-block"> <span> <button type="button" class="btn btn-primary btn-block">Go Back</button> </span> </div> <div class="col-sm-4 btn-vert-block"> <span> <button type="button" class="btn btn-primary btn-block center-block">Preview</button> </span> </div> <div class="col-sm-4 btn-vert-block"> <span class="

I want to execute less and similar programs from the command-line in PHP. I have tried the usual suspects (exec, shell_exec, passthru, etc), and while many of them can dump the file to the screen, the process is terminated before I can make use of it. If I wanted cat , I'd use it. How do I execute a program in this fashion? You could use proc_open to feed input to and get output back from a process via pipes. However, it doesn't seem like less allows for user interaction via pipes as it basically degrades to a cat command. Here's my first (failed) approach: <?php $dspec = array( 0 = array(

前言 首先阅读本文之前建议先看一下Bootstrap基础以及Less简介,不然你不会知道我在云什么.因为最近打算用Bootstrap+Less进行开发,但是Less虽然有一些资料,不过大都是Example类型的,感觉比较抽象更像是API,在网上又找不到比较好的解说,所以打算自己写点. 对Bootstrap和Less有兴趣的可以看一下官网(中文): http://www.bootcss.com/ 和 http://www.bootcss.com/p/lesscss/ . 正文 在Github上维护的Bootstrap项目就是基于Less的,而且作为目前来讲最优秀的前端CSS框架Bootstrap的功底也相当不错.所以直接看Less在Bootstrap中是如何实现的就能比较好的了解了.这里强调一点就是不管我们怎么看Less,最后是为了写出自己的东西,所以一切都是灵活的. 从 https://github.com/twbs/bootstrap 上下载到Bootstrap的源代码,这里面有一个Less文件夹,我们研究的重心就是这里了.现在还缺少一个Less的编译环境,可以用Grunt或者Nodejs,这里我选择一个图形界面软件 koala . Bootstrap源码包含了预先编译的CSS、JavaScript和图标字体文件，并且还有LESS、JavaScript和文档的源码。具体来说

I have some LessCSS that essentially looks like this: .foo { @height: 20px; @iconHeight: 13px; background-position: 0 (@height - @iconHeight) / 2; } However, this obviously turns out as background-position: 0 3.5px , and I'd prefer for it to be an integer (the value of Math.ceil ), however this doesn't work: background-position: 0 Math.ceil((@height - @iconHeight) / 2) Nor does using the javascript evaluation operator: background-position: 0 `Math.ceil((@height - @iconHeight) / 2)` ...since this is parsed as Math.ceil(20px - 13px) and the "px" there is a syntax error. I've even tried using

I recently started working with LESS, and as I did some research to automated builders like Jenkins and Grunt, it seemed a common piece of advice was not to store LESS files on the repo, or not to have them on the live server, just the compiled CSS. So I was hoping to get some advice on this. It seems that as LESS files are part of the project, storing them is necessary. But it makes sense not to have extra, random files on the live server. Deleting them myself seems the wrong way to do it every build, plus time consuming. I assume I can get automated builders to do it for me, though I don't

How do you call a mixin dynamically? A use case might be to generate a style guide: // The mixin which should be called .typography-xs(){ font-family: Arial; font-size: 16px; line-height: 22px; } // The mixin which tries to call typography-xs .typography-demo(@typographyName, @mixinName) { @{typographyName} { &:before{content: '@{typographyName}';} // Calling the mixin dynamically @mixinName(); } } // Example call of .typograhpy-demo .typography-demo(xs, typography-xs); Is such a dynamic call possible at all with less css? You cannot at present dynamically call as you desire. You can, however,