43 lines
1.0 KiB
SCSS
43 lines
1.0 KiB
SCSS
|
@use '../core/style/private';
|
||
|
|
@use '../core/style/variables';
|
||
|
|
@use './tabs-common';
|
||
|
|
|
||
|
|
@include tabs-common.structural-styles;
|
||
|
|
|
||
|
|
.mat-mdc-tab {
|
||
|
|
@include tabs-common.tab;
|
||
|
|
|
||
|
|
// Note that we only want to target direct descendant tabs.
|
||
|
|
.mat-mdc-tab-group.mat-mdc-tab-group-stretch-tabs > .mat-mdc-tab-header & {
|
||
|
|
flex-grow: 1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.mat-mdc-tab-group {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
// Fixes pagination issues inside flex containers (see #23157).
|
||
|
|
max-width: 100%;
|
||
|
|
|
||
|
|
@include tabs-common.paginated-tab-header-with-background('.mat-mdc-tab-header', '.mat-mdc-tab');
|
||
|
|
|
||
|
|
&.mat-mdc-tab-group-inverted-header {
|
||
|
|
flex-direction: column-reverse;
|
||
|
|
|
||
|
|
.mdc-tab-indicator__content--underline {
|
||
|
|
align-self: flex-start;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// The bottom section of the view; contains the tab bodies
|
||
|
|
.mat-mdc-tab-body-wrapper {
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
display: flex;
|
||
|
|
transition: height tabs-common.$mat-tab-animation-duration variables.$ease-in-out-curve-function;
|
||
|
|
|
||
|
|
@include private.private-animation-noop();
|
||
|
|
}
|