2016-06-07 6 views
1

그리드의 열 색상을 변경하고 싶습니다.Vaadin, 그리드 열 색상 변경

grid.setCellStyleGenerator((Grid.CellReference cellReference) -> { 
      if ("name".equals(cellReference.getPropertyId())) { 
       return "highlight-green"; 
      } else { 
       return "rightAligned"; 
      } 
     }); 

mytheme.scss :

@import "../valo/valo.scss"; 

@mixin mytheme { 
    @include valo; 

    // Insert your own theme rules here 

    .rightAligned { 
     text-align: right; 
    } 

.v-table-row.v-table-row-highlight-green, 
.v-table-row-odd.v-table-row-highlight-green { 
     background-color: #00ff00; 
    } 
} 
rightAligned가 잘 작동

하지만 highlight-green은하지 않습니다

+1

Firefox는 [CSS 검사] (https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS) 스타일 문제에 대한 훌륭한 작업입니다. 빌트인 개발자 도구를 사용하여 스타일이 겹쳐 쓰여진 이유를 확인하고 테스트를 위해 클라이언트 측에서 스타일을 추가/변경할 수 있습니다. –

+1

'v-table-row'와'v-table-row-odd'는 바아 딘 테이블을위한 것이고, 그리드 구성 요소는 다른 스타일 클래스 인'v-grid-row'와'v-grid-row-stripe'을 사용합니다. –

답변

0

시도가 background-color: #00ff00 !important;

를 추가 불행하게도 아무 일도 발생하지 않습니다 ... 여기에 나의 코드

프레임 워크의 기존 스타일 인 012를 다시 작성해야하는 것처럼 보입니다.이 도움이 필요합니다.

+0

내 테마에 스타일을 추가 할 때 '! important'는 필요하지 않습니다. 우선 순위는'@mixin'의 시작 부분에서'@include' valo 테마에 의해 제어됩니다. –

+0

jsfiddle을 만들 수 있습니까? 따라서 귀하의 경우에 대한 해결책을 찾는 것이 더 쉬울 것입니다. –

+0

OP의 의견 기다리기를 기다립니다. –