libre.sh/keycloak-scim
2
0
Fork 0
Code Issues 14 Pull requests Releases Packages Activity Actions 6

fixing social icons for issue https://github.com/keycloak/keycloak/issues/12047 (#12977)

Browse source
This commit is contained in:
Tyler Andor 2022-07-14 12:26:18 -06:00 committed by GitHub
parent ec853a6b83
commit e4fda78f5f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
themes/src/main/resources/theme/keycloak.v2/account/resources/public/layout.css
View file

@ -15,48 +15,6 @@
}
}
/* Linked Accounts screen */
.idp-icon-social {
width: 32px;
height: 32px;
}
#github-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_github_transparent.svg);
}
#linkedin-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_linkedin_transparent.svg);
}
#facebook-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_facebook_transparent.svg);
}
#google-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_google_transparent.svg);
}
#microsoft-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_microsoft_transparent.svg);
}
#instagram-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_instagram_transparent.svg);
}
#stackoverflow-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_stack_transparent.svg);
}
#twitter-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_twitter_transparent.svg);
}
#openshift-idp-icon-social {
background-image: url(../img/socialmedia/socialmedia_icons_openshift_transparent.svg);
}
/* Account Page screen */
.personal-info-form .pf-c-form__group-control {
max-width: 600px;

30
themes/src/main/resources/theme/keycloak.v2/account/src/app/content/linked-accounts-page/LinkedAccountsPage.tsx
View file

@ -24,7 +24,6 @@ import {
DataListItemCells,
DataListCell,
DataListItemRow,
Divider,
Label,
PageSection,
PageSectionVariants,
@ -43,7 +42,15 @@ import {
LinkIcon,
OpenshiftIcon,
PaypalIcon,
UnlinkIcon
UnlinkIcon,
FacebookIcon,
GoogleIcon,
InstagramIcon,
MicrosoftIcon,
TwitterIcon,
StackOverflowIcon,
LinkedinIcon,
GithubIcon
} from '@patternfly/react-icons';
import {HttpResponse} from '../../account-service/account.service';
@ -222,14 +229,31 @@ class LinkedAccountsPage extends React.Component<LinkedAccountsPageProps, Linked
const socialIconId = `${account.providerAlias}-idp-icon-social`;
console.log(account);
switch (true) {
case account.providerName.toLowerCase().includes('linkedin'):
return <LinkedinIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('facebook'):
return <FacebookIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('google'):
return <GoogleIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('instagram'):
return <InstagramIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('microsoft'):
return <MicrosoftIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('bitbucket'):
return <BitbucketIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('twitter'):
return <TwitterIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('openshift'):
return <div className="idp-icon-social" id="openshift-idp-icon-social" />;
// return <div className="idp-icon-social" id="openshift-idp-icon-social" />;
return <OpenshiftIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('gitlab'):
return <GitlabIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('github'):
return <GithubIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('paypal'):
return <PaypalIcon id={socialIconId} size='lg'/>;
case account.providerName.toLowerCase().includes('stackoverflow'):
return <StackOverflowIcon id={socialIconId} size='lg'/>;
case (account.providerName !== '' && account.social):
return <div className="idp-icon-social" id={socialIconId}/>;
default: