Import classes move state to other classes in .LESS

Just learn without words and use the bootstrap on twitter in my project.

If I want a green button to submit the form, I need to write:

<input type="submit" value="submit" class="btn btn-success" />

But I can skip the class attribute in the input tag.

I will not modify the twitter bootstrap file. I will overload them in the default.less file as follows:

button, input[type="submit"]{ .btn; .btn-success; }

But then I do not get the hang state and the active state of the button, and I get errors if I try to do it like this:

button, input[type="submit"]{/* previus code... */ &:hover{ .btn:hover; }}

You may notice what I'm trying to accomplish. I know that I can do this in jquery or javascript, but I can do this in my unlimited file without touching the original boot files.

+3
source share
2 answers

, Bootstrap CSS.

CSS-? , .btn-hover .btn:hover, button, input[type="submit"]:

&:hover {
    .btn-hover;
    .btn-success-hover;
}
0

.btn .btn-success - . . mixin mixins.less, .buttonBackground. mixin :

button, input[type="submit"]{
     .buttonBackground(@startColor,@endColor);
}

@startColor @endColor , @endColor. variables.less(btnInfoBackgroundHighlight) .

.btn-success{
      &:hover{
           background-color: @yourOwnColor;
      }
}
0

All Articles