feat(toolbar): Tweak css reset a little more (#74666)

ryan953 · web-flow · commit cb71631211ef · 2024-07-22T13:15:53.000-07:00
Just came across https://css-tricks.com/alvaro-montoro-css-one-liners-to-improve-almost-every-project/ and thought there are some easy to incorporate things that will be good for this as an sdk.
diff --git a/static/app/components/devtoolbar/styles/global.ts b/static/app/components/devtoolbar/styles/global.ts
@@ -50,7 +50,19 @@ export const globalCss = css`
     }
   }
 
-  * {
+  @media (prefers-reduced-motion) {
+    *,
+    *::before,
+    *::after {
+      animation-duration: 0s !important;
+      transition: none !important;
+      scroll-behavior: auto !important;
+    }
+  }
+
+  *,
+  *::before,
+  *::after {
     box-sizing: border-box;
   }
 

Original file line number	Diff line number	Diff line change
@@ -50,7 +50,19 @@ export const globalCss = css`
`50`	`50`	`}`
`51`	`51`	`}`
`52`	`52`
`53`		`- * {`
	`53`	`+ @media (prefers-reduced-motion) {`
	`54`	`+ *,`
	`55`	`+ *::before,`
	`56`	`+ *::after {`
	`57`	`+ animation-duration: 0s !important;`
	`58`	`+ transition: none !important;`
	`59`	`+ scroll-behavior: auto !important;`
	`60`	`+ }`
	`61`	`+ }`
	`62`	`+`
	`63`	`+ *,`
	`64`	`+ *::before,`
	`65`	`+ *::after {`
`54`	`66`	`box-sizing: border-box;`
`55`	`67`	`}`
`56`	`68`