diff --git a/packages/modules/src/modules/epics/ButtonApplePay.tsx b/packages/modules/src/modules/epics/ButtonApplePay.tsx index 314412cf0..f8d30b203 100644 --- a/packages/modules/src/modules/epics/ButtonApplePay.tsx +++ b/packages/modules/src/modules/epics/ButtonApplePay.tsx @@ -4,6 +4,7 @@ import { palette } from '@guardian/src-foundations'; import { ThemeProvider } from '@emotion/react'; import { LinkButton } from '@guardian/src-button'; import type { ReactComponent } from '../../types'; +import { from } from '@guardian/src-foundations/mq'; type LinkButtonColourStyles = { text: string; @@ -42,10 +43,15 @@ type Props = { const linkButtonColorStyles = (buttonStyles: LinkButtonColourStyles): SerializedStyles => css` width: 100%; justify-content: center; + padding: 0 10px; border: 1px solid ${buttonStyles.border}!important; background-color: ${buttonStyles.background} !important; color: ${buttonStyles.text} !important; + ${from.mobileMedium} { + padding: 0 20px; + } + :hover { background-color: ${buttonStyles.hover} !important; }