Utilizzo del pulsante di avvio per cambiare il colore del pulsante

Question

Sto utilizzando RoR per creare un sito Web di rails di un mese. Questo è il codice dal foglio styles.css.scss. Utilizza il bootstrap. Non sono sicuro del perché, ma il colore del pulsante non cambia nonostante il $ btnPrimaryBackground: testo verde. Qualcuno ha qualche idea o idea sul perché il colore del pulsante non cambia? Grazie.

$baseFontFamily: Oxygen; 
@import url(http://fonts.googleapis.com/css?family=Oxygen); 


$navbarBackgroundHighlight: white; 
$navbarBackground: white; 
$btnPrimaryBackground: green; 

@import 'bootstrap'; 
body{ 
    padding-top: 60px; 
} 

@import 'bootstrap-responsive'; 

.navbar-inner{ 
    @include box-shadow(none !important); 
    border: 0; 
} 

.footer{ 
    margin-top: 50px; 
    color: $grayLight; 
    a{ 
     color: $gray; 
    } 
} 

Answer 1

Se si utilizza Bootsrap con meno, si può semplicemente fare:

.btn-primary { 
    .buttonBackground(@yourColor, @yourColorDarker); //(button, hover) 
} 

Se poi non è sufficiente sostituire la classe di pulsante di cui si desidera cambiare il colore:

.btn-warning { background-color: Your color; } //button 

.btn-warning:hover { background-color: Your color; } //hover 

Inoltre, poiché sembra che tu voglia cambiare il colore del pulsante in verde perché non usi la classe .btn-success in questo modo:

Fonte: Styling twitter bootstrap buttons

Answer 2

In Bootstrap 3 buttonBackground non funziona più, è necessario utilizzare button-variant(@color; @background; @border) come questo:

.btn-custom { 
    .button-variant(@custom-color, @custom-color-bg, @custom-color-border); 
} 

Answer 3

E 'possibile fare il proprio e ereditare da .btn-default. In SCSS in questo modo:

.btn-custom {@extend .btn; @extend .btn-default; colore: # 6EA81A; }