diff --git a/UNRELEASED.md b/UNRELEASED.md index c0a87c6d6f6..80dd65ff3c7 100644 --- a/UNRELEASED.md +++ b/UNRELEASED.md @@ -7,11 +7,11 @@ Use [the changelog guidelines](/documentation/Versioning%20and%20changelog.md) t ### Enhancements - [ColorPicker] Add an inset box-shadow to make it easier to see the draggers ([#4948](https://github.com/Shopify/polaris-react/pull/4948)) - - Tightened up the Navigation component UI density. ([#4874](https://github.com/Shopify/polaris-react/pull/4874)) - Updated the Navigation IA ([#4902](https://github.com/Shopify/polaris-react/pull/4902)) - Added new `duplicateRootItem` prop to a Navigation Section to support new mobile Navigation IA ([#4902](https://github.com/Shopify/polaris-react/pull/4902)) - Updated mobile behaviour of Navigation to only show one sub-section at a time ([#4902](https://github.com/Shopify/polaris-react/pull/4902)) +- Remove the info icon and external link guidance from FooterHelp ([#4982](https://github.com/Shopify/polaris-react/pull/4982)) ### Bug fixes diff --git a/src/components/FooterHelp/FooterHelp.scss b/src/components/FooterHelp/FooterHelp.scss index e1b11f3f0d5..76af7befe34 100644 --- a/src/components/FooterHelp/FooterHelp.scss +++ b/src/components/FooterHelp/FooterHelp.scss @@ -7,30 +7,15 @@ $border-radius: 999px; display: flex; justify-content: center; margin: spacing(loose) 0; - width: 100%; - - @include page-content-when-not-fully-condensed { - margin: spacing(loose); - width: auto; - } -} - -.Content { - display: inline-flex; - align-items: center; padding: spacing(loose) spacing(loose) spacing(loose) spacing(); width: 100%; - justify-content: center; @include page-content-when-not-fully-condensed { + margin: spacing(loose); width: auto; } } -.Icon { - margin-right: spacing(tight); -} - .Text { @include text-style-input; } diff --git a/src/components/FooterHelp/FooterHelp.tsx b/src/components/FooterHelp/FooterHelp.tsx index e21a69aec99..757f818da3a 100644 --- a/src/components/FooterHelp/FooterHelp.tsx +++ b/src/components/FooterHelp/FooterHelp.tsx @@ -1,8 +1,4 @@ import React from 'react'; -import {InfoMinor} from '@shopify/polaris-icons'; - -import {classNames} from '../../utilities/css'; -import {Icon, IconProps} from '../Icon'; import styles from './FooterHelp.scss'; @@ -12,21 +8,9 @@ export interface FooterHelpProps { } export function FooterHelp({children}: FooterHelpProps) { - const className = classNames(styles.FooterHelp); - - const iconProps: IconProps = { - source: InfoMinor, - color: 'highlight', - }; - return ( -
-
-
- -
-
{children}
-
+
+
{children}
); } diff --git a/src/components/FooterHelp/README.md b/src/components/FooterHelp/README.md index e80538c41f9..3692308c81b 100644 --- a/src/components/FooterHelp/README.md +++ b/src/components/FooterHelp/README.md @@ -81,7 +81,7 @@ Use to direct merchants to more information related to the product or feature th ```jsx Learn more about{' '} - + fulfilling orders diff --git a/src/components/FooterHelp/tests/FooterHelp.test.tsx b/src/components/FooterHelp/tests/FooterHelp.test.tsx index 0e385a1b28a..1a0c27f18ca 100644 --- a/src/components/FooterHelp/tests/FooterHelp.test.tsx +++ b/src/components/FooterHelp/tests/FooterHelp.test.tsx @@ -1,8 +1,6 @@ import React from 'react'; -import {InfoMinor} from '@shopify/polaris-icons'; import {mountWithApp} from 'tests/utilities'; -import {Icon} from '../../Icon'; import {FooterHelp} from '../FooterHelp'; describe('', () => { @@ -14,11 +12,4 @@ describe('', () => { children, }); }); - - it('renders the help icon', () => { - const footerHelp = mountWithApp({children}); - expect(footerHelp).toContainReactComponent(Icon, { - source: InfoMinor, - }); - }); });