2017-12-21 28 views
0
내가 재료 탭 구성 요소 AngularDart 재료 구성 요소에서 여백을 제거 할

. 어떻게해야합니까? enter image description hereAngularDart 소재 comonents의 재료 탭에서 마진을 제거하는 방법

tab_component.html

<material-tab-panel centerStrip class="tab-panel visible-desktop" [activeTabIndex]="1"> 
    <material-tab label="Home"> 
     Eager Content of Tab 1 
    </material-tab> 
    <material-tab label="Tab 1"> 
     <div class="tab-background"> 

     </div> 
    </material-tab> 
    <material-tab label="Tab 2"> 
     Eager Content of Tab 3 
    </material-tab> 
    <material-tab label="Tab 3"> 
     Eager Content of Tab 3 
    </material-tab> 
</material-tab-panel> 

tab_component.scss 패딩 물질은 클래스 탭으로 설정

material-tab-panel { 
    width: 400px; 
} 

material-tab { 
    width: 100vw; 
} 

.tab-background { 
    height: 100vh; 
    width: 100vw; 
    background-color: aqua; 
} 

답변

0

@import 'package:angular_components/tree/master/lib/css/material/material'; 
@import 'package:angular_components/tree/master/lib/material_tab/mixins'; 

@include tab-panel-accent-color('.tab-panel', $mat-red); 
@include tab-panel-tab-strip-width('material-tab-panel[centerStrip]', 400px); 

tab_component.css. tab_component.css에서 다음과 같이 덮어 씀으로써 변경할 수 있습니다.

material-tab.material-tab { 
    padding: 0px; 
}