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

@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

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

material-tab { 
    width: 100vw; 
} 

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

答えて

0

。次のようにtab_component.cssに上書きして変更することができます:

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