mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-24 20:24:05 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

⚡ Add Google icon for OAuth to meet their branding guidelines

Browse source
This commit is contained in:
Jan Oberhauser 2020-12-03 12:36:34 +01:00
parent 9969faf52a
commit 8fee799d3d
2 changed files with 21 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
packages/editor-ui/public/google-signin.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 7.9 KiB

25
packages/editor-ui/src/components/CredentialsInput.vue
View file

@ -53,10 +53,15 @@
Connected
</span>
<span v-else>
<el-button title="Connect OAuth Credentials" @click.stop="oAuthCredentialAuthorize()" circle>
<font-awesome-icon icon="sign-in-alt" />
</el-button>
Not connected
<span v-if="isGoogleOAuthType">
<img :src="basePath + 'google-signin.png'" class="google-icon clickable" alt="Sign in with Google" @click.stop="oAuthCredentialAuthorize()" />
</span>
<span v-else>
<el-button title="Connect OAuth Credentials" @click.stop="oAuthCredentialAuthorize()" circle>
<font-awesome-icon icon="sign-in-alt" />
</el-button>
Not connected
</span>
</span>
<div v-if="credentialProperties.length">
@ -160,6 +165,7 @@ export default mixins(
},
data () {
return {
basePath: this.$store.getters.getBaseUrl,
isMinimized: true,
helpTexts: {
credentialsData: 'The credentials to set.',
@ -218,6 +224,13 @@ export default mixins(
return this.credentialDataTemp;
},
isGoogleOAuthType (): boolean {
if (this.credentialTypeData.name === 'googleOAuth2Api') {
return true;
}
const types = this.parentTypes(this.credentialTypeData.name);
return types.includes('googleOAuth2Api');
},
isOAuthType (): boolean {
if (['oAuth1Api', 'oAuth2Api'].includes(this.credentialTypeData.name)) {
return true;
@ -531,6 +544,10 @@ export default mixins(
.oauth-information {
line-height: 2.5em;
margin: 2em 0;
.google-icon {
width: 191px;
}
}
.parameter-wrapper {