Issue / 8725 Extract Subtle Notification Styling

[10upsimon]

Summary

Addresses issue:

• Extract "Subtle Notification" styling/logic to a shared SubtleNotification component #8725

Relevant technical choices

• Created a new SubtleNotification component to centralise implementation for subtle notification banners
• Updated various banners making use if said styling to instead incorporate said new component
• Updated and added VRT tests accordingly

PR Author Checklist

• My code is tested and passes existing unit tests.
• My code has an appropriate set of unit tests which all pass.
• My code is backward-compatible with WordPress 5.2 and PHP 7.4.
• My code follows the WordPress coding standards.
• My code has proper inline documentation.
• I have added a QA Brief on the issue linked above.
• I have signed the Contributor License Agreement (see https://cla.developers.google.com/).

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Code Reviewer Checklist

• Run the code.
• Ensure the acceptance criteria are satisfied.
• Reassess the implementation with the IB.
• Ensure no unrelated changes are included.
• Ensure CI checks pass.
• Check Storybook where applicable.
• Ensure there is a QA Brief.

Merge Reviewer Checklist

• Ensure the PR has the correct target branch.
• Double-check that the PR is okay to be merged.
• Ensure the corresponding issue has a ZenHub release assigned.
• Add a changelog message to the issue.

[github-actions]

Build files for 9c03c4e have been deleted.

[github-actions]

Size Change: +4.63 kB (+0.28%)

Total Size: 1.67 MB

Filename	Size	Change
./dist/assets/css/googlesitekit-admin-css-********************.min.css	55 kB	+281 B (+0.51%)
./dist/assets/js/googlesitekit-activation-********************.js	23.7 kB	-13 B (-0.05%)
./dist/assets/js/googlesitekit-ad-blocking-recovery-********************.js	59.7 kB	+267 B (+0.45%)
./dist/assets/js/googlesitekit-adminbar-********************.js	34.5 kB	-37 B (-0.11%)
./dist/assets/js/googlesitekit-api-********************.js	10 kB	-5 B (-0.05%)
./dist/assets/js/googlesitekit-components-gm2-********************.js	5.88 kB	+7 B (+0.12%)
./dist/assets/js/googlesitekit-components-gm3-********************.js	10.1 kB	+1 B (+0.01%)
./dist/assets/js/googlesitekit-data-********************.js	2.35 kB	-3 B (-0.13%)
./dist/assets/js/googlesitekit-datastore-forms-********************.js	9.03 kB	-2 B (-0.02%)
./dist/assets/js/googlesitekit-datastore-location-********************.js	2.08 kB	+3 B (+0.14%)
./dist/assets/js/googlesitekit-datastore-site-********************.js	20.4 kB	-13 B (-0.06%)
./dist/assets/js/googlesitekit-datastore-ui-********************.js	9.97 kB	-1 B (-0.01%)
./dist/assets/js/googlesitekit-datastore-user-********************.js	25.1 kB	-12 B (-0.05%)
./dist/assets/js/googlesitekit-entity-dashboard-********************.js	77.1 kB	+50 B (+0.06%)
./dist/assets/js/googlesitekit-main-dashboard-********************.js	142 kB	+368 B (+0.26%)
./dist/assets/js/googlesitekit-modules-********************.js	22.1 kB	+17 B (+0.08%)
./dist/assets/js/googlesitekit-modules-ads-********************.js	29.5 kB	-1 B (0%)
./dist/assets/js/googlesitekit-modules-adsense-********************.js	114 kB	+626 B (+0.55%)
./dist/assets/js/googlesitekit-modules-analytics-4-********************.js	163 kB	+836 B (+0.52%)
./dist/assets/js/googlesitekit-modules-pagespeed-insights-********************.js	22.6 kB	+8 B (+0.04%)
./dist/assets/js/googlesitekit-modules-reader-revenue-manager-********************.js	13.6 kB	+733 B (+5.71%)	🔍
./dist/assets/js/googlesitekit-modules-search-console-********************.js	58.1 kB	+78 B (+0.13%)
./dist/assets/js/googlesitekit-modules-tagmanager-********************.js	32 kB	+29 B (+0.09%)
./dist/assets/js/googlesitekit-notifications-********************.js	3.63 kB	+1 B (+0.03%)
./dist/assets/js/googlesitekit-polyfills-********************.js	377 B	+1 B (+0.27%)
./dist/assets/js/googlesitekit-settings-********************.js	74.1 kB	+242 B (+0.33%)
./dist/assets/js/googlesitekit-splash-********************.js	74 kB	+492 B (+0.67%)
./dist/assets/js/googlesitekit-user-input-********************.js	48.7 kB	+246 B (+0.51%)
./dist/assets/js/googlesitekit-vendor-********************.js	321 kB	+12 B (0%)
./dist/assets/js/googlesitekit-widgets-********************.js	78.7 kB	+148 B (+0.19%)
./dist/assets/js/googlesitekit-wp-dashboard-********************.js	61.7 kB	+271 B (+0.44%)
./dist/assets/js/runtime-********************.js	1.3 kB	-2 B (-0.15%)

ℹ️ View Unchanged

Filename	Size
./dist/assets/css/googlesitekit-adminbar-css-********************.min.css	11 kB
./dist/assets/css/googlesitekit-authorize-application-css-********************.min.css	846 B
./dist/assets/css/googlesitekit-wp-dashboard-css-********************.min.css	7.35 kB
./dist/assets/js/31-********************.js	2.76 kB
./dist/assets/js/32-********************.js	2.25 kB
./dist/assets/js/33-********************.js	3.64 kB
./dist/assets/js/34-********************.js	935 B
./dist/assets/js/35-********************.js	892 B
./dist/assets/js/36-********************.js	3.12 kB
./dist/assets/js/analytics-advanced-tracking-********************.js	901 B
./dist/assets/js/googlesitekit-consent-mode-********************.js	25.6 kB
./dist/assets/js/googlesitekit-events-provider-contact-form-7-********************.js	646 B
./dist/assets/js/googlesitekit-events-provider-easy-digital-downloads-********************.js	624 B
./dist/assets/js/googlesitekit-events-provider-mailchimp-********************.js	630 B
./dist/assets/js/googlesitekit-events-provider-ninja-forms-********************.js	712 B
./dist/assets/js/googlesitekit-events-provider-optin-monster-********************.js	675 B
./dist/assets/js/googlesitekit-events-provider-popup-maker-********************.js	634 B
./dist/assets/js/googlesitekit-events-provider-woocommerce-********************.js	657 B
./dist/assets/js/googlesitekit-events-provider-wpforms-********************.js	633 B
./dist/assets/js/googlesitekit-i18n-********************.js	3.93 kB

_{compressed-size-action}

[eugene-manuilov]

Thanks, @10upsimon. Looks good to me but there are two minor issues that we need to address.