abacritt/angularx-social-login

Making Google button responsive

Closed this issue · 0 comments

Hey there,

is there any way of making the google signin button responsive for the mobile devices?

I used one suggestion from previous issues and made my own directive:

`import { Directive, ElementRef } from '@angular/core';
import { take } from 'rxjs';
import { SocialAuthService } from '@abacritt/angularx-social-login';

declare var google;

@directive({
selector: 'google-signin-button'
})
export class GoogleSigninButtonDirective {

constructor(
el: ElementRef,
private socialAuthService: SocialAuthService
) {
this.render(el)
}

render(el) {
this.socialAuthService.initState.pipe(take(1)).subscribe(() => {
google.accounts.id.renderButton(el.nativeElement, {
type: 'standard',
size: 'large',
width: '400',
text: 'signin_with',
logo_alignment: 'center',
theme: 'outline'
});
})
}
}`

Only thing I would make out with this would be to define device with on init and sorting it trough like this, but it's still not good enough.

Thank you in advance