I've come across this question which I thought might work for me but unfortunately does not apply.
What I wish to accomplish is basically to assign bottstrap's .input-sm
class to all <input/>
and <select/>
elements in my web app; but instead of searching the whole project and manually adding it, I thought I'd do this via css, like so:
/*app.scss*/
@import "bootstrap.min.css";
input, select {
@extend .input-sm;
}
Compass complains it can't find the .input-sm
selector; trying the suggestion posted in the aforementioned question:
/*app.scss*/
@import "bootstrap.min.css";
input, select {
@extend %input-sm;
}
doesn't get me very far either, because compass still complains it can't find the %input-sm
selector, this time.
Am I destined to go over all my pages and assign the .input-sm
class to all my controls or is there an alternative I am overseeing? Cheers.
EDIT: I don't think this question should be marked as duplicate of this other quesiton as user @cimmanon suggested, since I am experiencing no problem whatsoever in importing bootstrap.min.css
to my scss
file. The import works, what doesn't is the possibility of referencing classes from the imported file at compile-time.
EDIT 2: Ok, I realized that the other question, though I'm still convinced it is not a duplicate of this one, provides some insights as to how to achieve what I'm after: simply renaming bootstrap's css file to scss
extension makes the @extend
command work.