Fix abm table overflow issue (#23722)

relates to #21986 fix a UI overflow issue on the abm table - [x] Changes file added for user-visible changes in `changes/`, `orbit/changes/` or `ee/fleetd-chrome/changes`. - [x] Manual QA for all new/changed functionality
fleetdm · Nov 19, 2024 · cb3e1d5 · cb3e1d5
1 parent 249189f
commit cb3e1d5
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/changes/21986-fix-to-abm-token-table-responsive b/changes/21986-fix-to-abm-token-table-responsive
@@ -0,0 +1 @@
+- fix responsive styles for the adm table
diff --git a/...ds/MdmSettings/AppleBusinessManagerPage/components/AppleBusinessManagerTable/_styles.scss b/...ds/MdmSettings/AppleBusinessManagerPage/components/AppleBusinessManagerTable/_styles.scss
@@ -1,5 +1,16 @@
 .apple-business-manager-table {
 
+  .data-table-block .data-table {
+    td.apple_id__cell {
+      max-width: 180px;
+    }
+
+    td.macos_team__cell, td.ios_team__cell, td.ipados_team__cell {
+      max-width: 150px;
+    }
+  }
+
+
   // The desired behavior is to hide the header and team cell one by one
   // as the viewport gets smaller. This is achieved by using the max-width
   // media query with the breakpoint values taken from when the table content