From 2f2513ced9f66e8c7f156398f6892aae510a50c2 Mon Sep 17 00:00:00 2001
From: Denys Vuika <denis.vuyka@gmail.com>
Date: Tue, 28 Mar 2017 09:47:01 +0100
Subject: [PATCH] fix long names in columns (ellipsis-cell class) (#1775)

---
 .../datatable/datatable.component.css           | 17 +++++------------
 .../datatable/datatable.component.html          |  4 ++--
 2 files changed, 7 insertions(+), 14 deletions(-)

diff --git a/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.css b/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.css
index eeb366bd82..6d2cf2eda8 100644
--- a/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.css
+++ b/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.css
@@ -14,7 +14,6 @@
 :host .data-cell {
     cursor: default;
 }
-:host .cell-value {}
 
 :host .column-header {
     cursor: pointer;
@@ -35,17 +34,13 @@
     width: 100%;
 }
 
-:host .ellipsis-cell > div
-{
-    position: relative;
-    overflow: hidden;
-    /*height: 1em;*/
+
+:host .ellipsis-cell .cell-container {
+    height: 1em;
 }
 
-
 /* visible content */
-:host .ellipsis-cell > div > span
-{
+:host .ellipsis-cell .cell-value {
     display: block;
     position: absolute;
     max-width: 100%;
@@ -57,15 +52,13 @@
 
 
 /* cell stretching content */
-:host .ellipsis-cell > div:after
-{
+:host .ellipsis-cell > div:after {
     content: attr(title);
     overflow: hidden;
     height: 0;
     display: block;
 }
 
-
 /* Utils */
 
 :host .non-selectable {
diff --git a/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html b/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
index 62ee352727..91d4583b78 100644
--- a/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
+++ b/ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html
@@ -70,7 +70,7 @@
             (dblclick)="onRowDblClick(row, $event)"
             [context-menu]="getContextMenuActions(row, col)"
             [context-menu-enabled]="contextMenu">
-            <div *ngIf="!col.template">
+            <div *ngIf="!col.template" class="cell-container">
                 <div *ngSwitchCase="'image'" class="cell-value">
                     <i *ngIf="isIconValue(row, col)" class="material-icons icon-cell">{{asIconValue(row, col)}}</i>
                     <img *ngIf="!isIconValue(row, col)"
@@ -89,7 +89,7 @@
                 <!-- empty cell for unknown column type -->
                 </span>
             </div>
-            <div *ngIf="col.template">
+            <div *ngIf="col.template" class="cell-container">
                 <template ngFor [ngForOf]="[{ data: data, row: row, col: col }]" [ngForTemplate]="col.template"></template>
             </div>
         </td>