move cell wrap style to cell content

cloudscape-design · Nov 26, 2024 · 4c9b8a8 · 4c9b8a8
1 parent 49a178d
commit 4c9b8a8
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/src/table/body-cell/styles.scss b/src/table/body-cell/styles.scss
@@ -131,11 +131,12 @@ $cell-negative-space-vertical: 2px;
 
   &-content {
     box-sizing: border-box;
-  }
-  &:not(.body-cell-wrap) > .body-cell-content {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
+
+    &:not(.body-cell-wrap) {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
   }
   &:first-child {
     border-inline-start: $border-placeholder;

diff --git a/src/table/body-cell/td-element.tsx b/src/table/body-cell/td-element.tsx
@@ -118,7 +118,6 @@ export const TableTdElement = React.forwardRef<HTMLTableCellElement, TableTdElem
         style={{ ...style, ...stickyStyles.style }}
         className={clsx(
           styles['body-cell'],
-          wrapLines && styles['body-cell-wrap'],
           isFirstRow && styles['body-cell-first-row'],
           isLastRow && styles['body-cell-last-row'],
           isSelected && styles['body-cell-selected'],
@@ -159,7 +158,7 @@ export const TableTdElement = React.forwardRef<HTMLTableCellElement, TableTdElem
           </div>
         )}
 
-        <div className={styles['body-cell-content']}>{children}</div>
+        <div className={clsx(styles['body-cell-content'], wrapLines && styles['body-cell-wrap'])}>{children}</div>
       </Element>
     );
   }