moved inline styles to internal styles

nuxeo · Dec 17, 2024 · efb9cb4 · efb9cb4
1 parent 416203f
commit efb9cb4
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 8 deletions.
diff --git 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
@@ -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
@@ -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>