applePay button children area widened at mobile breakpoint

guardian · Oct 18, 2023 · c50b78d · c50b78d
1 parent a187bff
commit c50b78d
Showing 1 changed file with 6 additions and 0 deletions.
diff --git 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;
     }