sass-references/angular-material/material/tabs/tab-header.html

44 lines
1.6 KiB
HTML

<!--
Note that this intentionally uses a `div` instead of a `button`, because it's not part of
the regular tabs flow and is only here to support mouse users. It should also not be focusable.
-->
<div class="mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-before"
#previousPaginator
mat-ripple
[matRippleDisabled]="_disableScrollBefore || disableRipple"
[class.mat-mdc-tab-header-pagination-disabled]="_disableScrollBefore"
(click)="_handlePaginatorClick('before')"
(mousedown)="_handlePaginatorPress('before', $event)"
(touchend)="_stopInterval()">
<div class="mat-mdc-tab-header-pagination-chevron"></div>
</div>
<div
class="mat-mdc-tab-label-container"
#tabListContainer
(keydown)="_handleKeydown($event)"
[class._mat-animation-noopable]="_animationMode === 'NoopAnimations'">
<div
#tabList
class="mat-mdc-tab-list"
role="tablist"
[attr.aria-label]="ariaLabel || null"
[attr.aria-labelledby]="ariaLabelledby || null"
(cdkObserveContent)="_onContentChanges()">
<div class="mat-mdc-tab-labels" #tabListInner>
<ng-content></ng-content>
</div>
</div>
</div>
<div class="mat-mdc-tab-header-pagination mat-mdc-tab-header-pagination-after"
#nextPaginator
mat-ripple
[matRippleDisabled]="_disableScrollAfter || disableRipple"
[class.mat-mdc-tab-header-pagination-disabled]="_disableScrollAfter"
(mousedown)="_handlePaginatorPress('after', $event)"
(click)="_handlePaginatorClick('after')"
(touchend)="_stopInterval()">
<div class="mat-mdc-tab-header-pagination-chevron"></div>
</div>