fix issues with the icons column in DT/DL (#2277)

* fix issues with the icons column in DT/DL

- fix issue with screen reader label not being translated
- fix issue with column taking the width of the screen reader label

* fix custom selection icon position
This commit is contained in:
Denys Vuika
2017-09-01 15:04:06 +01:00
committed by Mario Romano
parent 480bef7ad9
commit 7f720fda3a
3 changed files with 26 additions and 27 deletions

View File

@@ -45,7 +45,7 @@ adf-document-list >>> adf-datatable tr.is-selected .image-table-cell::before {
top: 50%; top: 50%;
left: 50%; left: 50%;
margin-top: -16px; margin-top: -16px;
margin-left: -28px; margin-left: -12px;
border-radius: 100%; border-radius: 100%;
background: #00bcd4; background: #00bcd4;
} }

View File

@@ -23,7 +23,7 @@
role="button" role="button"
tabindex="0" tabindex="0"
title="{{ col.title }}"> title="{{ col.title }}">
<span *ngIf="col.srTitle" class="sr-only">{{col.srTitle}}</span> <span *ngIf="col.srTitle" class="sr-only">{{ col.srTitle | translate }}</span>
<span *ngIf="col.title">{{ col.title | translate}}</span> <span *ngIf="col.title">{{ col.title | translate}}</span>
</th> </th>
<!-- Actions (right) --> <!-- Actions (right) -->

View File

@@ -222,36 +222,35 @@
display: block; display: block;
} }
} }
}
/* Utils */ /* [Accessibility] For screen reader only */
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
/* [Accessibility] For screen reader only */ /* Utils */
:host .sr-only { .hidden {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
.hidden {
display: none;
}
/* mobile phone */
@media all and (max-width: 768px) {
.desktop-only {
display: none; display: none;
} }
}
@media (max-device-width: 768px) { /* mobile phone */
.desktop-only { @media all and (max-width: 768px) {
display: none; .desktop-only {
display: none;
}
}
@media (max-device-width: 768px) {
.desktop-only {
display: none;
}
} }
} }