chore: update legacy styles with icons (#1414)

Niznikr · web-flow · commit 17cdcbd38a73 · 2024-09-26T12:35:58.000-04:00
diff --git a/.changeset/fifty-cycles-tap.md b/.changeset/fifty-cycles-tap.md
@@ -0,0 +1,10 @@
+---
+"@launchpad-ui/clipboard": patch
+"@launchpad-ui/banner": patch
+"@launchpad-ui/alert": patch
+"@launchpad-ui/toast": patch
+"@launchpad-ui/modal": patch
+"@launchpad-ui/core": patch
+---
+
+Update legacy styles with icons
diff --git a/packages/alert/src/styles/Alert.module.css b/packages/alert/src/styles/Alert.module.css
@@ -81,19 +81,19 @@
 
 /* Alert kind variants */
 
-.Alert.Alert--info .Alert-icon svg {
+.Alert.Alert--info .Alert-icon {
 	fill: var(--lp-color-fill-feedback-info);
 }
 
-.Alert.Alert--success .Alert-icon svg {
+.Alert.Alert--success .Alert-icon {
 	fill: var(--lp-color-fill-feedback-success);
 }
 
-.Alert.Alert--warning .Alert-icon svg {
+.Alert.Alert--warning .Alert-icon {
 	fill: var(--lp-color-fill-feedback-warning);
 }
 
-.Alert.Alert--error .Alert-icon svg {
+.Alert.Alert--error .Alert-icon {
 	fill: var(--lp-color-fill-feedback-error);
 }
 
@@ -106,7 +106,7 @@
 	color: var(--lp-component-alert-notification-flair-strong-color-text);
 }
 
-.Alert.Alert--notification.Alert--flair-strong .Alert-close svg {
+.Alert.Alert--notification.Alert--flair-strong .Alert-close {
 	fill: var(--lp-component-alert-notification-flair-strong-color-fill);
 }
 
diff --git a/packages/banner/src/styles/Banner.module.css b/packages/banner/src/styles/Banner.module.css
@@ -59,14 +59,14 @@
 	transform: translateY(2px);
 }
 
-.Banner.Banner--info .Banner-icon svg {
+.Banner.Banner--info .Banner-icon {
 	fill: var(--lp-color-fill-feedback-info);
 }
 
-.Banner.Banner--error .Banner-icon svg {
+.Banner.Banner--error .Banner-icon {
 	fill: var(--lp-color-fill-feedback-error);
 }
 
-.Banner.Banner--warning .Banner-icon svg {
+.Banner.Banner--warning .Banner-icon {
 	fill: var(--lp-color-fill-feedback-warning);
 }
diff --git a/packages/clipboard/src/styles/CopyToClipboard.module.css b/packages/clipboard/src/styles/CopyToClipboard.module.css
@@ -2,7 +2,7 @@
 	position: relative;
 }
 
-.Clipboard-checkmark svg {
+.Clipboard-checkmark {
 	fill: var(--lp-color-system-green-500);
 }
 
diff --git a/packages/modal/src/styles/Modal.module.css b/packages/modal/src/styles/Modal.module.css
@@ -63,10 +63,7 @@
 
 .headerIcon {
 	transform: translateY(2px);
-
-	svg {
-		fill: var(--lp-color-fill-feedback-warning);
-	}
+	fill: var(--lp-color-fill-feedback-warning);
 }
 
 .headerMain {
diff --git a/packages/toast/src/styles/Toast.module.css b/packages/toast/src/styles/Toast.module.css
@@ -15,15 +15,15 @@
 	transform: translateY(2px);
 }
 
-.Toast--error .Toast-icon svg {
+.Toast--error .Toast-icon {
 	fill: var(--lp-color-pink-500);
 }
 
-.Toast--warning .Toast-icon svg {
+.Toast--warning .Toast-icon {
 	fill: var(--lp-color-yellow-500);
 }
 
-.Toast--success .Toast-icon svg {
+.Toast--success .Toast-icon {
 	fill: var(--lp-color-system-green-500);
 }
 

Original file line number	Diff line number	Diff line change
`@@ -81,19 +81,19 @@`
`81`	`81`
`82`	`82`	`/* Alert kind variants */`
`83`	`83`
`84`		`-.Alert.Alert--info .Alert-icon svg {`
	`84`	`+.Alert.Alert--info .Alert-icon {`
`85`	`85`	`fill: var(--lp-color-fill-feedback-info);`
`86`	`86`	`}`
`87`	`87`
`88`		`-.Alert.Alert--success .Alert-icon svg {`
	`88`	`+.Alert.Alert--success .Alert-icon {`
`89`	`89`	`fill: var(--lp-color-fill-feedback-success);`
`90`	`90`	`}`
`91`	`91`
`92`		`-.Alert.Alert--warning .Alert-icon svg {`
	`92`	`+.Alert.Alert--warning .Alert-icon {`
`93`	`93`	`fill: var(--lp-color-fill-feedback-warning);`
`94`	`94`	`}`
`95`	`95`
`96`		`-.Alert.Alert--error .Alert-icon svg {`
	`96`	`+.Alert.Alert--error .Alert-icon {`
`97`	`97`	`fill: var(--lp-color-fill-feedback-error);`
`98`	`98`	`}`
`99`	`99`
`@@ -106,7 +106,7 @@`
`106`	`106`	`color: var(--lp-component-alert-notification-flair-strong-color-text);`
`107`	`107`	`}`
`108`	`108`
`109`		`-.Alert.Alert--notification.Alert--flair-strong .Alert-close svg {`
	`109`	`+.Alert.Alert--notification.Alert--flair-strong .Alert-close {`
`110`	`110`	`fill: var(--lp-component-alert-notification-flair-strong-color-fill);`
`111`	`111`	`}`
`112`	`112`
Original file line number	Diff line number	Diff line change
`@@ -59,14 +59,14 @@`
`59`	`59`	`transform: translateY(2px);`
`60`	`60`	`}`
`61`	`61`
`62`		`-.Banner.Banner--info .Banner-icon svg {`
	`62`	`+.Banner.Banner--info .Banner-icon {`
`63`	`63`	`fill: var(--lp-color-fill-feedback-info);`
`64`	`64`	`}`
`65`	`65`
`66`		`-.Banner.Banner--error .Banner-icon svg {`
	`66`	`+.Banner.Banner--error .Banner-icon {`
`67`	`67`	`fill: var(--lp-color-fill-feedback-error);`
`68`	`68`	`}`
`69`	`69`
`70`		`-.Banner.Banner--warning .Banner-icon svg {`
	`70`	`+.Banner.Banner--warning .Banner-icon {`
`71`	`71`	`fill: var(--lp-color-fill-feedback-warning);`
`72`	`72`	`}`
Original file line number	Diff line number	Diff line change
`@@ -2,7 +2,7 @@`
`2`	`2`	`position: relative;`
`3`	`3`	`}`
`4`	`4`
`5`		`-.Clipboard-checkmark svg {`
	`5`	`+.Clipboard-checkmark {`
`6`	`6`	`fill: var(--lp-color-system-green-500);`
`7`	`7`	`}`
`8`	`8`
Original file line number	Diff line number	Diff line change
`@@ -15,15 +15,15 @@`
`15`	`15`	`transform: translateY(2px);`
`16`	`16`	`}`
`17`	`17`
`18`		`-.Toast--error .Toast-icon svg {`
	`18`	`+.Toast--error .Toast-icon {`
`19`	`19`	`fill: var(--lp-color-pink-500);`
`20`	`20`	`}`
`21`	`21`
`22`		`-.Toast--warning .Toast-icon svg {`
	`22`	`+.Toast--warning .Toast-icon {`
`23`	`23`	`fill: var(--lp-color-yellow-500);`
`24`	`24`	`}`
`25`	`25`
`26`		`-.Toast--success .Toast-icon svg {`
	`26`	`+.Toast--success .Toast-icon {`
`27`	`27`	`fill: var(--lp-color-system-green-500);`
`28`	`28`	`}`
`29`	`29`