feat: fix empty custom CSS for new rows in signin items table (#2897)

This commit is contained in:
DacongDA 2024-04-24 15:19:30 +08:00 committed by GitHub
parent af2d26daf2
commit 8dbb041a34
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 18 additions and 4 deletions

View File

@ -209,7 +209,7 @@ func extendApplicationWithSigninItems(application *Application) (err error) {
signinItem := &SigninItem{
Name: "Back button",
Visible: true,
Label: ".back-button {\n top: 65px;\n left: 15px;\n position: absolute;\n}",
Label: ".back-button {\n top: 65px;\n left: 15px;\n position: absolute;\n}\n.back-inner-button{}",
Placeholder: "",
Rule: "None",
}

View File

@ -543,7 +543,7 @@ class LoginPage extends React.Component {
);
} else if (signinItem.name === "Back button") {
return (
<div>
<div className="back-button">
<div dangerouslySetInnerHTML={{__html: ("<style>" + signinItem.label?.replaceAll("<style>", "").replaceAll("</style>", "") + "</style>")}} />
{
this.renderBackButton()
@ -1199,8 +1199,7 @@ class LoginPage extends React.Component {
renderBackButton() {
if (this.state.orgChoiceMode === "None" || this.props.preview === "auto") {
return (
<Button type="text" size="large" icon={<ArrowLeftOutlined />}
className="back-button"
<Button className="back-inner-button" type="text" size="large" icon={<ArrowLeftOutlined />}
onClick={() => history.back()}>
</Button>
);

View File

@ -26,6 +26,20 @@ require("codemirror/mode/htmlmixed/htmlmixed");
const {Option} = Select;
export const SigninTableDefaultCssMap = {
"Back button": ".back-button {\n top: 65px;\n left: 15px;\n position: absolute;\n}\n.back-inner-button{}",
"Languages": ".login-languages {\n top: 55px;\n right: 5px;\n position: absolute;\n}",
"Logo": ".login-logo-box {}",
"Signin methods": ".signin-methods {}",
"Username": ".login-username {}\n.login-username-input{}",
"Password": ".login-password {}\n.login-password-input{}",
"Agreement": ".login-agreement {}",
"Forgot password?": ".login-forget-password {\n display: inline-flex;\n justify-content: space-between;\n width: 320px;\n margin-bottom: 25px;\n}",
"Login button": ".login-button-box {\n margin-bottom: 5px;\n}\n.login-button {\n width: 100%;\n}",
"Signup link": ".login-signup-link {\n margin-bottom: 24px;\n display: flex;\n justify-content: end;\n}",
"Providers": ".provider-img {\n width: 30px;\n margin: 5px;\n}\n.provider-big-img {\n margin-bottom: 10px;\n}",
};
class SigninTable extends React.Component {
constructor(props) {
super(props);
@ -120,6 +134,7 @@ class SigninTable extends React.Component {
value={getItemDisplayName(text)}
onChange={value => {
this.updateField(table, index, "name", value);
this.updateField(table, index, "label", SigninTableDefaultCssMap[value]);
}} >
{
Setting.getDeduplicatedArray(items, table, "name").map((item, index) => <Option key={index} value={item.name}>{item.displayName}</Option>)