Notice: Update dismiss button to match other Gutenberg UI (#16926)

* Update hover/active/focus color to dark gray. * Update close button color to be darker. This matches our other close buttons throughout the interface. * Use no-alt instead of no dashicon.
WordPress · Aug 7, 2019 · 612d8bc · 612d8bc
1 parent 766476a
commit 612d8bc
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/packages/components/src/notice/index.js b/packages/components/src/notice/index.js
@@ -69,7 +69,7 @@ function Notice( {
 			{ isDismissible && (
 				<IconButton
 					className="components-notice__dismiss"
-					icon="no"
+					icon="no-alt"
 					label={ __( 'Dismiss this notice' ) }
 					onClick={ onRemove }
 					tooltip={ false }

diff --git a/packages/components/src/notice/style.scss b/packages/components/src/notice/style.scss
@@ -45,12 +45,12 @@
 	position: absolute;
 	top: 0;
 	right: 0;
-	color: $dark-gray-300;
+	color: $dark-gray-500;
 
 	&:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover,
 	&:not(:disabled):not([aria-disabled="true"]):not(.is-default):active,
 	&:not(:disabled):not([aria-disabled="true"]):focus {
-		color: $alert-red;
+		color: $dark-gray-900;
 		background-color: transparent;
 	}