| @@ -31,8 +31,27 @@ | ||
| 31 | 31 | vipps-mobilepay-badge { |
| 32 | 32 | width: 90vw; |
| 33 | 33 | } |
| 34 | 34 | |
| 35 | +/* Avoid having the new web component button get outlined IOK 2026-08-07 */ | |
| 36 | +vipps-mobilepay-button:focus, | |
| 37 | +vipps-mobilepay-button:focus-visible { | |
| 38 | + outline: none; | |
| 39 | +} | |
| 40 | + | |
| 41 | +/* Make the express button in checkout match other buttons; aiming for 48px IOK 2026-09-24 | |
| 42 | +* (https://developer.woocommerce.com/docs/features/payments/ux-guidelines/payment-button-size/?utm_source=chatgpt.com#layout-and-spacing) */ | |
| 43 | +.wc-block-components-express-payment--checkout #express-payment-method-vippsexpress div.vipps-express-container { | |
| 44 | + scale: calc(48 / 44); | |
| 45 | + transform-origin: top left; | |
| 46 | + width: calc(100%*44/48); | |
| 47 | +} | |
| 48 | +/* And in the cart. */ | |
| 49 | +.wc-block-components-express-payment--cart #express-payment-method-vippsexpress div.vipps-express-container { | |
| 50 | + scale: calc(48 / 44); | |
| 51 | + transform-origin: top left; | |
| 52 | + width: calc(100%*44/48); | |
| 53 | +} | |
| 35 | 54 | |
| 36 | 55 | /* Vipps Checkout Widgets */ |
| 37 | 56 | .vipps_checkout_widget_wrapper { |
| 38 | 57 | width: 100%; |
