[ADF-2990] Datatable - access header row via keyboard (#5206)

* header row as adf-datatable-row

* remove tabindex if header is hidden

* adjust logic if no row data is passed

* skip row focus if disabled

* set active row index on header interaction

* take in account header row

* fix header row and cells focus

* tests

* fix reference

* fix tests
This commit is contained in:
Cilibiu Bogdan
2019-11-04 10:08:15 +02:00
committed by Eugenio Romano
parent 5c4511e42b
commit 040fc52724
6 changed files with 153 additions and 22 deletions

View File

@@ -220,6 +220,24 @@
color: $data-table-cell-text-color;
}
.adf-datatable-row {
&:hover, &:focus {
background-color: $data-table-hover-color;
}
&:focus {
outline-offset: -1px;
outline: $data-table-outline;
}
.adf-cell-value, .adf-datatable-cell-header {
&:focus {
outline-offset: -1px;
outline: $data-table-outline;
}
}
}
.adf-datatable-body {
display: flex;
flex-direction: column;
@@ -234,15 +252,6 @@
@include adf-no-select;
&:hover, &:focus {
background-color: $data-table-hover-color;
}
&:focus {
outline-offset: -1px;
outline: $data-table-outline;
}
&.adf-is-selected, &.adf-is-selected:hover {
background-color: $data-table-selection-color;
}
@@ -418,11 +427,6 @@
align-items: center;
word-break: break-all;
width: 100%;
&:focus {
outline-offset: -1px;
outline: $data-table-outline;
}
}
.adf-datatable__actions-cell, .adf-datatable-cell--image {