-1

This is a quick question to let me just get started. I am working on a node application and planning to use scss for styling. So my question is if I include bootstrap css file from cdn in my index.html I can not override the variables.

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">

For example

a:hover, a:focus {
  padding-bottom: 5px;
  text-decoration: none;
  border-bottom: 1px solid $link-hover-color;
}

The variable $link-hover-color given an error "Can not find variable "link-hover-color"

Do I need to include the bootstrap sass in my project manually and not use the cdn? Since grunt won't let me start the application because of error on link-hover-color variable

0xburned
  • 2,625
  • 8
  • 39
  • 69
  • How do you think Sass is going to see variables in a file that it isn't importing, especially when the file in question doesn't even contain variables? – cimmanon Apr 14 '15 at 11:31

1 Answers1

0

You mentioned grunt so I assume you are using grunt to "compile" your scss to css.

As far as I know grunt will not be able to know what to do with $link-hover-color if it does not have the sources from bootstrap.

You could add bootstrap to your project to complie and use the cdn then in you html files.

That should work because when the html is delivered to the browser the css will have already been compiled. I am not quite sure, though. I would try it out

cw24
  • 1,613
  • 2
  • 22
  • 31
  • yeah eventually Grunt will compile my scss to css, but since I am directly using the bootstrap cdn to my index.html file grunt can't find the bootstrap variables. So you think the only option to add bootstrap sass folder in my project? Should I add bootstrap sass as my development dependency and use bootstrap cdn in my html file when grunt complies my project successfully? Its just I don't want to add heavy bootstrap as my project dependency, but dev-dependency might work. – 0xburned Apr 14 '15 at 08:32
  • Basically. My hope is that you could have grunt access the bootstrap sass files when building your css. Then when you deploy, just deploy your css and include bootstrap's cdn. You will have to make sure that grunt does not throw all the sass files into one css, if you do not want the overhead. – cw24 Apr 15 '15 at 14:47