Search code examples
quickbooksintuit-partner-platformquickbooks-online

Can I change the IPP "Sign in with Intuit" button size?

Per QBO's documentation here...

https://developer.intuit.com/docs/0025_quickbooksapi/0010_getting_started/0030_integrate_your_app/0030_signing_into_and_out_of_intuit_from_within_your_app/sign-in#AddSIButton

...I added the SSO login button via this code:

<ipp:login href="http://example.com/myapp/SendOpenIDRequest" type="vertical"></ipp:login>

This works; however, it loads a comically small login button. Looking into the css, the image loaded is:

https://appcenter.intuit.com/Content/IA/button_signinwithintuit_horiz_small.png

teeny tiny image

So, using my super detective skills I changed the small to large and get this working image:

https://appcenter.intuit.com/Content/IA/button_signinwithintuit_horiz_large.png

hefty hefty hefty

BUT, there doesn't appear to be any documented way to display large instead of small, and modifying it using my css is against QBO's guidelines.

Is there something I missed in the documentation or perhaps is documented elsewhere to use that larger image?

Solution

  • The following CSS will display the large icon instead of the small. Ran into the same issue myself.

    .intuitPlatformLoginButtonHorizontal
{
background: url(https://appcenter.intuit.com/Content/IA/button_signinwithintuit_horiz_large.png) no-repeat 0 0;
width: 200px;
height: 43px;
}