mirror of
https://github.com/casdoor/casdoor.git
synced 2025-05-24 08:20:31 +08:00
Improve oauth button UI.
This commit is contained in:
parent
8132ea9621
commit
8ddc0cd626
@ -106,15 +106,16 @@ class LoginPage extends React.Component {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
getLoginButton(type) {
|
getSigninButton(type) {
|
||||||
|
const text = i18next.t("login:Sign in with {type}").replace("{type}", type);
|
||||||
if (type === "GitHub") {
|
if (type === "GitHub") {
|
||||||
return <GithubLoginButton />
|
return <GithubLoginButton text={text} align={"center"} />
|
||||||
} else if (type === "Google") {
|
} else if (type === "Google") {
|
||||||
return <GoogleLoginButton />
|
return <GoogleLoginButton text={text} align={"center"} />
|
||||||
} else if (type === "QQ") {
|
} else if (type === "QQ") {
|
||||||
return <QqLoginButton />
|
return <QqLoginButton text={text} align={"center"} />
|
||||||
} else {
|
} else {
|
||||||
return `Log in with ${type}`;
|
return text;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -130,7 +131,7 @@ class LoginPage extends React.Component {
|
|||||||
<div key={provider.displayName} style={{marginBottom: "10px"}}>
|
<div key={provider.displayName} style={{marginBottom: "10px"}}>
|
||||||
<a href={Provider.getAuthUrl(application, provider, "signup")}>
|
<a href={Provider.getAuthUrl(application, provider, "signup")}>
|
||||||
{
|
{
|
||||||
this.getLoginButton(provider.type)
|
this.getSigninButton(provider.type)
|
||||||
}
|
}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
@ -234,13 +235,13 @@ class LoginPage extends React.Component {
|
|||||||
return (
|
return (
|
||||||
<div style={{marginTop: "20px"}}>
|
<div style={{marginTop: "20px"}}>
|
||||||
<div style={{fontSize: 16, textAlign: "left"}}>
|
<div style={{fontSize: 16, textAlign: "left"}}>
|
||||||
Sign in
|
{i18next.t("login:To access")}
|
||||||
<a target="_blank" rel="noreferrer" href={application.homepageUrl}>
|
<a target="_blank" rel="noreferrer" href={application.homepageUrl}>
|
||||||
<span style={{fontWeight: "bold"}}>
|
<span style={{fontWeight: "bold"}}>
|
||||||
{application.displayName}
|
{application.displayName}
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
with:
|
:
|
||||||
</div>
|
</div>
|
||||||
<br/>
|
<br/>
|
||||||
{
|
{
|
||||||
|
@ -19,7 +19,7 @@ function Icon({ width = 24, height = 24, color }) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const config = {
|
const config = {
|
||||||
text: "Log in with QQ",
|
text: "Sign in with QQ",
|
||||||
icon: Icon,
|
icon: Icon,
|
||||||
iconFormat: name => `fa fa-${name}`,
|
iconFormat: name => `fa fa-${name}`,
|
||||||
style: {background: "rgb(94,188,249)"},
|
style: {background: "rgb(94,188,249)"},
|
||||||
|
@ -73,7 +73,9 @@
|
|||||||
"Forgot password?": "Forgot password?",
|
"Forgot password?": "Forgot password?",
|
||||||
"Sign In": "Sign In",
|
"Sign In": "Sign In",
|
||||||
"No account yet?": "No account yet?",
|
"No account yet?": "No account yet?",
|
||||||
"sign up now": "sign up now"
|
"sign up now": "sign up now",
|
||||||
|
"To access": "To access",
|
||||||
|
"Sign in with {type}": "Sign in with {type}"
|
||||||
},
|
},
|
||||||
"account":
|
"account":
|
||||||
{
|
{
|
||||||
|
@ -73,7 +73,9 @@
|
|||||||
"Forgot password?": "忘记密码?",
|
"Forgot password?": "忘记密码?",
|
||||||
"Sign In": "登录",
|
"Sign In": "登录",
|
||||||
"No account yet?": "没有账号?",
|
"No account yet?": "没有账号?",
|
||||||
"sign up now": "立即注册"
|
"sign up now": "立即注册",
|
||||||
|
"To access": "访问",
|
||||||
|
"Sign in with {type}": "{type}登录"
|
||||||
},
|
},
|
||||||
"account":
|
"account":
|
||||||
{
|
{
|
||||||
|
Loading…
x
Reference in New Issue
Block a user