CODEWITHSUNDEEP
csstwitter-bootstrapsasspanel
LauraAy
LauraAy

Reputation: 1

Changing bootstrap panel color using sass

I'm pretty new to using both twitter bootstrap and sass. I am trying to modify the background color of the panel-header in bootstrap using a .sass file in a rails application.

This is the bootstrap css according to inspect element:

.panel-default > .panel-heading {
    color: #333333;
    background-color: #f5f5f5;
    border-color: #ddd;

and here's what I'm trying in my sass file to change the color

.panel-default
  .panel-heading
    background-color: #fdf1d8

I'm wondering if the problem has to do with the selector used in the bootstrap css? I don't know how that translates to indented sass. Suggestions?

Upvotes: 0

Views: 385

Answers (1)

marvinpoo
marvinpoo

Reputation: 5

What you are doing will spit out the following:

.panel-default .panel heading { 
  background-color: #fdf1d8; 
}

> is very specific, so you should use it, too: 

.panel-default > .panel-heading {
  background-color: #fdf1d8`
}

Upvotes: 0

Related Questions