chore(modal): remove unneeded will-change CSS property (#1958)

dancormier · web-flow · commit 4f0b3aa6ae0e · 2025-07-21T11:28:56.000-04:00
* chore(modal): remove unneeded will-change CSS rule

* Add changeset

* Trying that again

* line endings!
diff --git a/.changeset/petite-beans-start.md b/.changeset/petite-beans-start.md
@@ -0,0 +1,5 @@
+---
+"@stackoverflow/stacks": patch
+---
+
+Remove unneeded will-change CSS property on modal
diff --git a/lib/components/modal/modal.less b/lib/components/modal/modal.less
@@ -82,7 +82,6 @@
         transform: translate3d(0, 30%, 0) scale3d(0.6, 0.6, 0.6);
         transition: opacity 200ms var(--te-smooth) 0s, z-index 0s 100ms, visibility 0s 100ms, transform 100ms var(--te-smooth) 0s, transform 100ms var(--te-smooth) 0s; // Transition out
         visibility: hidden;
-        will-change: visibility, z-index, opacity, transform; // Not supported by Edge
         z-index: var(--zi-hide); // Make sure it's also below everything so we can't interact with it.
     }
 
@@ -113,6 +112,5 @@
     position: fixed;
     transition: opacity 100ms var(--te-smooth) 0s, z-index 0s 100ms, visibility 0s 100ms; // Transition out
     visibility: hidden;
-    will-change: visibility, z-index, opacity; // Not supported in Edge
     z-index: var(--zi-hide); // Make sure it's also below everything so we can't interact with it.
 }

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@stackoverflow/stacks": patch
 +---
++
 +Remove unneeded will-change CSS property on modal
Original file line number	Diff line number	Diff line change
`@@ -82,7 +82,6 @@`
`82`	`82`	`transform: translate3d(0, 30%, 0) scale3d(0.6, 0.6, 0.6);`
`83`	`83`	`transition: opacity 200ms var(--te-smooth) 0s, z-index 0s 100ms, visibility 0s 100ms, transform 100ms var(--te-smooth) 0s, transform 100ms var(--te-smooth) 0s; // Transition out`
`84`	`84`	`visibility: hidden;`
`85`		`- will-change: visibility, z-index, opacity, transform; // Not supported by Edge`
`86`	`85`	`z-index: var(--zi-hide); // Make sure it's also below everything so we can't interact with it.`
`87`	`86`	`}`
`88`	`87`
`@@ -113,6 +112,5 @@`
`113`	`112`	`position: fixed;`
`114`	`113`	`transition: opacity 100ms var(--te-smooth) 0s, z-index 0s 100ms, visibility 0s 100ms; // Transition out`
`115`	`114`	`visibility: hidden;`
`116`		`- will-change: visibility, z-index, opacity; // Not supported in Edge`
`117`	`115`	`z-index: var(--zi-hide); // Make sure it's also below everything so we can't interact with it.`
`118`	`116`	`}`