diff --git a/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.scss b/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.scss index 6e72fffa54c..a66d222c477 100644 --- a/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.scss +++ b/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.scss @@ -34,6 +34,13 @@ rgba( 196, 152, 217, 0.12 ) 77.75% ); + .woocommerce-marketing-introduction-banner-close-button { + position: absolute; + top: $gap-smaller; + right: $gap; + padding: 0; + } + img { display: block; width: 100%; diff --git a/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.tsx b/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.tsx index e56476fa096..c8f9377f251 100644 --- a/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.tsx +++ b/plugins/woocommerce-admin/client/marketing/overview-multichannel/IntroductionBanner/IntroductionBanner.tsx @@ -2,8 +2,14 @@ * External dependencies */ import { __ } from '@wordpress/i18n'; -import { Card, Flex, FlexItem, FlexBlock } from '@wordpress/components'; -import { Icon, trendingUp, megaphone } from '@wordpress/icons'; +import { Card, Flex, FlexItem, FlexBlock, Button } from '@wordpress/components'; +import { + Icon, + trendingUp, + megaphone, + closeSmall, + close, +} from '@wordpress/icons'; /** * Internal dependencies @@ -73,6 +79,15 @@ export const IntroductionBanner = () => {
+