diff --git a/lib/core/src/lib/datatable/components/datatable/datatable.component.html b/lib/core/src/lib/datatable/components/datatable/datatable.component.html index 29bfe10f40..19b3bf5d20 100644 --- a/lib/core/src/lib/datatable/components/datatable/datatable.component.html +++ b/lib/core/src/lib/datatable/components/datatable/datatable.component.html @@ -31,101 +31,106 @@ {{ 'ADF-DATATABLE.ACCESSIBILITY.SELECT_ALL' | translate }} +
+ class="adf-datatable-cell--{{col.type || 'text'}} {{col.cssClass}} adf-datatable-cell-header adf-datatable-cell-data" + *ngIf="col.title || !showProvidedActions" + [attr.data-automation-id]="'auto_id_' + col.key" + [ngClass]="{ + 'adf-sortable': col.sortable, + 'adf-datatable__cursor--pointer': !isResizing, + 'adf-datatable__header--sorted-asc': isColumnSorted(col, 'asc'), + 'adf-datatable__header--sorted-desc': isColumnSorted(col, 'desc')}" + [ngStyle]="(col.width) && !lastColumn && {'flex': getFlexValue(col)}" + [attr.aria-label]="col.title | translate" + (click)="onColumnHeaderClick(col, $event)" + (keyup.enter)="onColumnHeaderClick(col, $event)" + role="columnheader" + [attr.tabindex]="isHeaderVisible() ? 0 : null" + [attr.aria-sort]="col.sortable ? (getAriaSort(col) | translate) : null" + cdkDrag + cdkDragLockAxis="x" + (cdkDragStarted)="isDraggingHeaderColumn = true" + (cdkDragDropped)="onDropHeaderColumn($event)" + [cdkDragDisabled]="!col.draggable" + (mouseenter)="hoveredHeaderColumnIndex = columnIndex" + (mouseleave)="hoveredHeaderColumnIndex = -1" + adf-drop-zone dropTarget="header" [dropColumn]="col"> -
- - {{col.title | translate}} +
+ + {{col.title | translate}} - - {{ getSortLiveAnnouncement(col) | translate: { string: col.title | translate } }} - + + {{ getSortLiveAnnouncement(col) | translate: { string: col.title | translate } }} + - - + + -
- -
+
+ +
- - + + - + - - - -
-
-
-
-
+ + + +
+
+
+
+
+