I've created a simple npm tool to prefix bootstrap CSS classes.
You can find the tool on the npm website or on github.
To install:
npm install -g bootstrap-prefixer
To use:
bootstrap-prefixer [prefix] [path to bootstrap/less]
When prefixed with s-
, the following head -n27 bootstrap/carousel.less
//
// Carousel
// --------------------------------------------------
// Wrapper for the slide container and indicators
.carousel {
position: relative;
}
.carousel-inner {
position: relative;
overflow: hidden;
width: 100%;
> .item {
display: none;
position: relative;
.transition(.6s ease-in-out left);
// Account for jankitude on images
> img,
> a > img {
.img-responsive();
line-height: 1;
}
}
becomes
//
// Carousel
// --------------------------------------------------
// Wrapper for the slide container and indicators
.s-carousel {
position: relative;
}
.s-carousel-inner {
position: relative;
overflow: hidden;
width: 100%;
> .s-item {
display: none;
position: relative;
.s-transition(.6s ease-in-out left);
// Account for jankitude on images
> img,
> a > img {
&:extend(.s-img-responsive);
line-height: 1;
}
}