How to change the button size in checkout extension?

[ndt_ts]

I want to alter the button size of the button component in checkout extension?

https://shopify.dev/docs/api/checkout-ui-extensions/2023-07/components/actions/button

Is there any way to accomplish it?

Also is there any way to open a link on click of that button?

[Liam · Accepted solution]

Hi Ndt_ts,

You can't alter the size of the checkout buttons, this is an intentional decision to maintain the layout and style of the Shopify checkout. 

[ndt_ts]

Hi Liam,

is it possible to know if checkout extension is being shown on a mobile or desktop? i would like to show a different ui on mobile.

also is it possible to know the device resolution inside checkout extension? because most of the mobile screens falls under default styling of style helper, so my ui looks bad on many mobile screens..

any insights pls..!!!!

[bluetree]

How about alternate use InlineLayout ?

That way, you can create a full width button. You can then adjust the width using the columns property.

<InlineLayout columns={["fill"]}>
    <Button>text</Button>
</InlineLayout>