From efb9cb41c4d135a567ccc8d33a06589539dee98b Mon Sep 17 00:00:00 2001
From: swarnadipa-dev <swarnadipa.choudhury@globallogic.com>
Date: Tue, 17 Dec 2024 15:58:46 +0530
Subject: [PATCH] moved inline styles to internal styles

---
 ui/nuxeo-data-table/data-table-cell.js        | 9 +++++++++
 ui/nuxeo-data-table/data-table-column-sort.js | 7 ++++++-
 ui/nuxeo-data-table/data-table-column.js      | 8 +-------
 3 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/ui/nuxeo-data-table/data-table-cell.js b/ui/nuxeo-data-table/data-table-cell.js
index 8c61f3448..05cbf1d4e 100644
--- a/ui/nuxeo-data-table/data-table-cell.js
+++ b/ui/nuxeo-data-table/data-table-cell.js
@@ -35,6 +35,15 @@ import './data-table-templatizer-behavior.js';
           :host([header]) ::slotted(*) {
             min-width: 0;
           }
+
+          :host([header]) ::slotted(#columnHeader) {
+            flex: 1 1 70px;
+            min-width: 70px;
+            max-width: 120px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            text-align: start;
+          }
         </style>
         <slot></slot>
       `;
diff --git a/ui/nuxeo-data-table/data-table-column-sort.js b/ui/nuxeo-data-table/data-table-column-sort.js
index 0ffc1996b..84139c4b1 100644
--- a/ui/nuxeo-data-table/data-table-column-sort.js
+++ b/ui/nuxeo-data-table/data-table-column-sort.js
@@ -49,9 +49,14 @@ import { I18nBehavior } from '../nuxeo-i18n-behavior.js';
             right: 4px;
             bottom: 8px;
           }
+
+          #sortContainer {
+            position: relative; 
+            width: 40px;
+          }
         </style>
 
-        <div style="position: relative; width: 40px;">
+        <div id="sortContainer">
           <paper-icon-button
             id="sortIcon"
             on-click="_sort"
diff --git a/ui/nuxeo-data-table/data-table-column.js b/ui/nuxeo-data-table/data-table-column.js
index 345bcdd30..f927c091e 100644
--- a/ui/nuxeo-data-table/data-table-column.js
+++ b/ui/nuxeo-data-table/data-table-column.js
@@ -16,13 +16,7 @@ import './data-table-column-filter.js';
             role="columnheader"
           >
           </nuxeo-data-table-column-filter>
-          <div
-            title="[[column.name]]"
-            hidden$="[[column.filterBy]]"
-            role="columnheader"
-            style="flex: 1 1 70px; min-width: 70px;
-          max-width: 120px; overflow: hidden; text-overflow: ellipsis; text-align: start;"
-          >
+          <div id="columnHeader" title="[[column.name]]" hidden$="[[column.filterBy]]" role="columnheader">
             [[column.name]]
           </div>
         </template>