Make `Notice` component legible in dark themes (https://github.com/woocommerce/woocommerce-blocks/pull/8278)

* Make Notice component color black

The Notice component text is not legible in dark themes since the background color
is light and and the text color is too. With this change we are setting the color
always to black for our blocks, so it's always legible.

* Make the text black for notices displayed on the editor

* Import editor.scss

plugins/woocommerce-blocks/assets/js/blocks/attribute-filter/editor.scss

@@ -47,3 +47,7 @@
 	}
 
 }
+
+.wc-block-attribute-filter .components-notice__content {
+	color: $black;
+}

plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/edit.tsx

@@ -20,6 +20,7 @@ import {
 	AdditionalFieldsContent,
 } from '../../form-step';
 import Block from './block';
+import './editor.scss';
 
 type shippingAdminLink = {
 	id: number;

plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/editor.scss

@@ -0,0 +1,3 @@
+.wc-block-components-shipping-rates-control__no-results-notice .components-notice__content {
+	color: $black;
+}

plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-terms-block/editor.scss

@@ -34,3 +34,6 @@
 	}
 }
 
+.wc-block-checkout__terms_notice .components-notice__content {
+	color: $black;
+}

plugins/woocommerce-blocks/assets/js/blocks/rating-filter/edit.tsx

@@ -21,6 +21,7 @@ import {
  */
 import Block from './block';
 import { Attributes } from './types';
+import './editor.scss';
 
 const Edit = ( {
 	attributes,

plugins/woocommerce-blocks/assets/js/blocks/rating-filter/editor.scss

@@ -0,0 +1,3 @@
+.wc-block-rating-filter .components-notice__content {
+	color: $black;
+}

plugins/woocommerce-blocks/assets/js/blocks/store-notices/edit.tsx

@@ -5,6 +5,11 @@ import { useBlockProps } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 import { Notice } from '@wordpress/components';
 
+/**
+ * Internal dependencies
+ */
+import './editor.scss';
+
 const Edit = (): JSX.Element => {
 	const blockProps = useBlockProps( {
 		className: 'wc-block-store-notices',

plugins/woocommerce-blocks/assets/js/blocks/store-notices/editor.scss

@@ -0,0 +1,3 @@
+.wc-block-store-notices .components-notice__content {
+	color: $black;
+}