AdamT
AdamT

Reputation: 6485

Modifying Bootstrap variables when using bootstrap-sass

Here are all the less bootstrap variables: http://twitter.github.com/bootstrap/less.html

I've used the bootstrap-sass gem to add twitter bootstrap to my rails app which means I'm using sass. How do I modify/edit these less variables in my bootstrap_and_overrides.css.scss file?

When I try to do something like this:

@navbarBackground: #3D368B;

I get:

Sass::SyntaxError in Pages#home

Showing /Users/justme/myproject/app/views/layouts/application.html.erb where line #5 raised:

Invalid CSS after "@navbarBackground:": expected pseudoclass or pseudoelement, was " #3D368B;"

Upvotes: 7

Views: 3309

Answers (2)

Beau Smith
Beau Smith

Reputation: 34367

Variables in Sass start with a dollar sign ($) not an at symbol (@) which is used in Less.

Try this:

$navbarBackground: #3D368B;
@import "bootstrap";
@import "bootstrap-responsive";

Upvotes: 9

Rodrigo Zurek
Rodrigo Zurek

Reputation: 4575

to modify variables in saas, modify them before importing bootstrap

.alert{
  margin-top:-40px;
}



@import "bootstrap";
@import "bootstrap-responsive";

here in an example in my app

Upvotes: 4

Related Questions