Inheriting css class which is located in another file

Question

I am using bootstrap and less.

I want one of my class to inherit from a bootstrap class. The problem is I am using bootstrap from a cdn and don\'t want to have any boots

Answer 1

The question has been answered by seven-phases-max.

Less support import of file by url. You just have to tagg it as a less file, like this :

@import (less) "//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css";

Example here. Then you can reference to the class imported via url.

It is working, but inheriting a bootstrap class does not import all of the class feature. I inherited all my input with the class .form-control. Some of the features of the bootstrap form-control where imported (size, rounded corner) and others don't (blue light when selected). More about this here.

input[type="text"]{
    .form-control;
    width: 50%;
}

Answer 2

You don't have to install anything. Just download the less file you want to use from GitHub and import it:

@import (reference) "https://raw.githubusercontent.com/twbs/bootstrap/master/less/buttons.less";

Less Import

But I don’t think that's a good idea anyway. Less will have to request that file every time you compile.