Fixed action buttons from affecting item height (#1913)

bmingles · bmingles · commit 208685006e81 · 2024-05-09T15:12:05.000-05:00
diff --git a/packages/components/src/spectrum/listView/ListViewWrapper.scss b/packages/components/src/spectrum/listView/ListViewWrapper.scss
@@ -28,22 +28,37 @@
 }
 
 .dh-list-view-wrapper-density-compact {
+  // Ensure icons don't change the item height
   svg[class*='spectrum-Icon'] {
     height: var(--dh-list-view-item-icon-compact);
     width: var(--dh-list-view-item-icon-compact);
   }
+  // Ensure action buttons don't change the item height
+  button {
+    height: var(--dh-list-view-item-icon-compact);
+  }
 }
 
 .dh-list-view-wrapper-density-regular {
+  // Ensure icons don't change the item height
   svg[class*='spectrum-Icon'] {
     height: var(--dh-list-view-item-icon-regular);
     width: var(--dh-list-view-item-icon-regular);
   }
+  // Ensure action buttons don't change the item height
+  button {
+    height: var(--dh-list-view-item-icon-regular);
+  }
 }
 
 .dh-list-view-wrapper-density-spacious {
+  // Ensure icons don't change the item height
   svg[class*='spectrum-Icon'] {
     height: var(--dh-list-view-item-icon-spacious);
     width: var(--dh-list-view-item-icon-spacious);
   }
+  // Ensure action buttons don't change the item height
+  button {
+    height: var(--dh-list-view-item-icon-spacious);
+  }
 }

Original file line number	Diff line number	Diff line change
`@@ -28,22 +28,37 @@`
`28`	`28`	`}`
`29`	`29`
`30`	`30`	`.dh-list-view-wrapper-density-compact {`
	`31`	`+ // Ensure icons don't change the item height`
`31`	`32`	`svg[class*='spectrum-Icon'] {`
`32`	`33`	`height: var(--dh-list-view-item-icon-compact);`
`33`	`34`	`width: var(--dh-list-view-item-icon-compact);`
`34`	`35`	`}`
	`36`	`+ // Ensure action buttons don't change the item height`
	`37`	`+ button {`
	`38`	`+ height: var(--dh-list-view-item-icon-compact);`
	`39`	`+ }`
`35`	`40`	`}`
`36`	`41`
`37`	`42`	`.dh-list-view-wrapper-density-regular {`
	`43`	`+ // Ensure icons don't change the item height`
`38`	`44`	`svg[class*='spectrum-Icon'] {`
`39`	`45`	`height: var(--dh-list-view-item-icon-regular);`
`40`	`46`	`width: var(--dh-list-view-item-icon-regular);`
`41`	`47`	`}`
	`48`	`+ // Ensure action buttons don't change the item height`
	`49`	`+ button {`
	`50`	`+ height: var(--dh-list-view-item-icon-regular);`
	`51`	`+ }`
`42`	`52`	`}`
`43`	`53`
`44`	`54`	`.dh-list-view-wrapper-density-spacious {`
	`55`	`+ // Ensure icons don't change the item height`
`45`	`56`	`svg[class*='spectrum-Icon'] {`
`46`	`57`	`height: var(--dh-list-view-item-icon-spacious);`
`47`	`58`	`width: var(--dh-list-view-item-icon-spacious);`
`48`	`59`	`}`
	`60`	`+ // Ensure action buttons don't change the item height`
	`61`	`+ button {`
	`62`	`+ height: var(--dh-list-view-item-icon-spacious);`
	`63`	`+ }`
`49`	`64`	`}`