From 5dd76674ff188c09770b6ec81646481a3ab73b08 Mon Sep 17 00:00:00 2001
From: Levko Kravets <levko.ne@gmail.com>
Date: Fri, 23 Feb 2018 11:19:07 +0200
Subject: [PATCH] getredash/redash#2215 Custom CSS based on column type

---
 .../components/dynamic-table/default-cell/template.html   | 2 +-
 client/app/components/dynamic-table/dynamic-table.html    | 3 +--
 client/app/components/dynamic-table/dynamic-table.less    | 8 ++++++++
 .../app/components/dynamic-table/json-cell/template.html  | 2 +-
 4 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/client/app/components/dynamic-table/default-cell/template.html b/client/app/components/dynamic-table/default-cell/template.html
index 95d78ad2..aa85e06f 100644
--- a/client/app/components/dynamic-table/default-cell/template.html
+++ b/client/app/components/dynamic-table/default-cell/template.html
@@ -1,4 +1,4 @@
-<td ng-class="'content-align-' + column.alignContent">
+<td ng-class="'content-align-' + column.alignContent + ' display-as-' + column.displayAs">
   <div ng-if="allowHTML" ng-bind-html="value"></div>
   <div ng-if="!allowHTML" ng-bind="value"></div>
 </td>
diff --git a/client/app/components/dynamic-table/dynamic-table.html b/client/app/components/dynamic-table/dynamic-table.html
index 665b6619..645cbc5c 100644
--- a/client/app/components/dynamic-table/dynamic-table.html
+++ b/client/app/components/dynamic-table/dynamic-table.html
@@ -3,8 +3,7 @@
     <thead>
       <tr>
         <th ng-repeat="column in $ctrl.columns" ng-click="$ctrl.onColumnHeaderClick($event, column)"
-          class="sortable-column" ng-class="'content-align-' + column.alignContent"
-          width="{{ ['number', 'boolean', 'datetime', 'image'].indexOf(column.displayAs) >= 0 ? '1%' : undefined }}">
+          class="sortable-column" ng-class="'content-align-' + column.alignContent + ' display-as-' + column.displayAs">
           <span ng-if="($ctrl.orderBy.length > 1) && ($ctrl.orderByColumnsIndex[column.name] > 0)"
             class="sort-order-indicator">{{ $ctrl.orderByColumnsIndex[column.name] }}</span>
           <span>{{column.title}}</span>
diff --git a/client/app/components/dynamic-table/dynamic-table.less b/client/app/components/dynamic-table/dynamic-table.less
index 50d0da47..046bddaa 100644
--- a/client/app/components/dynamic-table/dynamic-table.less
+++ b/client/app/components/dynamic-table/dynamic-table.less
@@ -49,4 +49,12 @@
       }
     }
   }
+
+  .display-as-number,
+  .display-as-boolean,
+  .display-as-datetime,
+  .display-as-image {
+    width: 1%;
+    white-space: nowrap;
+  }
 }
diff --git a/client/app/components/dynamic-table/json-cell/template.html b/client/app/components/dynamic-table/json-cell/template.html
index 89280a3e..8488d80f 100644
--- a/client/app/components/dynamic-table/json-cell/template.html
+++ b/client/app/components/dynamic-table/json-cell/template.html
@@ -1,4 +1,4 @@
-<td>
+<td ng-class="'display-as-' + column.displayAs">
   <div ng-if="!isValid" class="json-cell-invalid">{{ value }}</div>
   <div ng-show="isValid" class="json-cell-valid"></div>
 </td>