Notice: Update dismiss button to match other Gutenberg UI

[kjellr]

Currently the dismiss button in the Notice component is a little non-standard:

• It uses the no dashicon, instead of no-alt (which is used in our modal and sidebar panel close buttons)
• It is $dark-gray-300 by default (instead of the usual $dark-gray-500), and is red on hover, regardless of the type of notification.

This PR updates those to be more consistent.

Screenshots

Before:

Notice dismiss icon alongside the panel close icon:

Hovers:

After:

Notice dismiss icon alongside the panel close icon:

Hovers:

Testing

Pasting this into your console should produce all 4 standard dismissible notices.

wp.data.dispatch('core/notices').createNotice(
	'',
	'Default',
	{
		isDismissible: true,
	}
);
wp.data.dispatch('core/notices').createNotice(
	'warning',
	'Warning',
	{
		isDismissible: true,
	}
);
wp.data.dispatch('core/notices').createNotice(
	'success',
	'Success',
	{
		isDismissible: true,
	}
);
wp.data.dispatch('core/notices').createNotice(
	'error',
	'Error',
	{
		isDismissible: true,
	}
);

[jorgefilipecosta]

LGTM 👍

[karmatosed]

Approving design as this is a great unifying PR. Thanks for catching this.

[ellatrix]

I'm seeing some js unit test error after this. Looks like you forgot to update a snapshot?

[ellatrix]

Travis CI - Pull Request Build Errored

This PR was merged while there were failing tests. :/

[jorgefilipecosta]

Thank you for fixing this problem @ellatrix. During the code review, we had another problem making CI tests fail and I did not notice the snapshot, I'm sorry for the potential troubles caused.

[mapk]

Thanks for taking care of this Kjell. 🎉