기초 단추 덮어 쓰기

Question

설명서 (http://foundation.zurb.com/docs/components/buttons.html)는 단추의 배경을 변경하는 것에 대해 아무 말도하지 않습니다. 내가 sass (custom.scss)에서 이것을 어떻게 할 수 있습니까?

Drupal에서 생성 된 구성 요소의 스타일을 변경해야하므로 새 buttonclass를 만들 수 없습니다.

Answer 1

새 클래스를 만들 수 없다면 기존 클래스를 확장 할 수 없습니까?

당신은이 작업을 수행 할 수 있습니다 내가 댓글을 추가 할 수 없기 때문에

button, 
.button, 
a.button, 
input.button 
{ 
    background-color: green; 
} 

Answer 2

그래서 난 그냥 대답으로 작성합니다. 모든 버튼의 배경색을 변경 하시겠습니까? 이 설정을 사용자 정의 할 수있는 파일이 있으며 기본적으로 주석이 있습니다. 이 같은 배경 색상 설정에 대한 몇 가지 라인을 찾을 수 : 를 재단 5 년의 주석을 해제

// $primary-color: #008CBA; 
// $secondary-color: #e7e7e7; 
// $alert-color: #f04124; 
// $success-color: #43AC6A; 
// $warning-color: #f08a24; 
// $info-color: #a0d3e8; 

_setting.scss 당신이 설정을 사용자 정의하고 당신이 원하는 색상의 값을 변경할 라인. 단추 스타일을 정의하는 파일에서 @import은 사용자 지정 설정이있는 파일 (이 경우 _settings.scss)입니다. 또한 사용자 정의 설정 파일을 가져 오는 다른 요소의 색상이 변경됩니다.

다른 방법으로 @mixin button의 정의로 이동하고 원하는 값으로 $bg을 변경하십시오.

&.secondary { @include button-style($bg:$secondary-color); } 
    &.success { @include button-style($bg:$success-color); } 
    &.alert  { @include button-style($bg:$alert-color); } 

&.disabled, &[disabled] { @include button-style($bg:$primary-color, $disabled:true); 
    &.secondary { @include button-style($bg:$secondary-color, $disabled:true); } 
    &.success { @include button-style($bg:$success-color, $disabled:true); } 
    &.alert { @include button-style($bg:$alert-color, $disabled:true); }