fix(MWPW-148801):Added two New sticky header variants. (#2744)

* sticky-header variants added * removed sticky header from all mobile devices * linting error * Added new sticky variant * updated the selector for table buttons
adobecom · Sep 5, 2024 · 0d6aadb · 0d6aadb
1 parent 264c998
commit 0d6aadb
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/libs/blocks/table/table.css b/libs/blocks/table/table.css
@@ -705,4 +705,12 @@ header.global-navigation {
     flex-direction: column;
     align-items: initial;
   }
+
+  .table :is(.heading-button,.action-area) {
+    max-width: 100%;
+  }
+
+  .table .action-area .con-button.button-l {
+    overflow: hidden;
+  }
 }
diff --git a/libs/blocks/table/table.js b/libs/blocks/table/table.js
@@ -501,7 +501,9 @@ export default function init(el) {
     expandSection = handleSection(sectionParams);
   });
 
-  const isStickyHeader = el.classList.contains('sticky');
+  const isStickyHeader = el.classList.contains('sticky')
+    || (el.classList.contains('sticky-desktop-up') && defineDeviceByScreenSize() === 'DESKTOP')
+    || (el.classList.contains('sticky-tablet-up') && defineDeviceByScreenSize() !== 'MOBILE');
 
   handleHighlight(el);
   if (isMerch) formatMerchTable(el);