switch to a LoginPage wrapper component

as it's much nicer in the CSS to wrap the LoginBox as needed rather than have separate header & footer divs floating above and below it which need to be correctly vertically centered
This commit is contained in:
Matthew Hodgson 2017-10-24 23:37:26 +01:00
parent f09fbccc19
commit 26e8b2c1b3
7 changed files with 70 additions and 89 deletions

View file

@ -154,6 +154,7 @@ module.exports = React.createClass({
},
render: function() {
const LoginPage = sdk.getComponent("login.LoginPage");
const LoginHeader = sdk.getComponent("login.LoginHeader");
const LoginFooter = sdk.getComponent("login.LoginFooter");
const ServerConfig = sdk.getComponent("login.ServerConfig");
@ -233,12 +234,12 @@ module.exports = React.createClass({
return (
<div className="mx_Login">
<LoginPage>
<div className="mx_Login_box">
<LoginHeader />
{ resetPasswordJsx }
</div>
</div>
</LoginPage>
);
},
});

View file

@ -329,8 +329,7 @@ module.exports = React.createClass({
render: function() {
const Loader = sdk.getComponent("elements.Spinner");
const LoginPageHeader = sdk.getComponent("login.LoginPageHeader");
const LoginPageFooter = sdk.getComponent("login.LoginPageFooter");
const LoginPage = sdk.getComponent("login.LoginPage");
const LoginHeader = sdk.getComponent("login.LoginHeader");
const LoginFooter = sdk.getComponent("login.LoginFooter");
const ServerConfig = sdk.getComponent("login.ServerConfig");
@ -367,8 +366,7 @@ module.exports = React.createClass({
}
return (
<div className="mx_Login">
<LoginPageHeader />
<LoginPage>
<div className="mx_Login_box">
<LoginHeader />
<div>
@ -389,8 +387,7 @@ module.exports = React.createClass({
<LoginFooter />
</div>
</div>
<LoginPageFooter />
</div>
</LoginPage>
);
},
});

View file

@ -59,9 +59,10 @@ module.exports = React.createClass({
render: function() {
const ChangeDisplayName = sdk.getComponent('settings.ChangeDisplayName');
const ChangeAvatar = sdk.getComponent('settings.ChangeAvatar');
const LoginPage = sdk.getComponent('login.LoginPage');
const LoginHeader = sdk.getComponent('login.LoginHeader');
return (
<div className="mx_Login">
<LoginPage>
<div className="mx_Login_box">
<LoginHeader />
<div className="mx_Login_profile">
@ -74,7 +75,7 @@ module.exports = React.createClass({
{ this.state.errorString }
</div>
</div>
</div>
</LoginPage>
);
},
});

View file

@ -322,6 +322,7 @@ module.exports = React.createClass({
render: function() {
const LoginHeader = sdk.getComponent('login.LoginHeader');
const LoginFooter = sdk.getComponent('login.LoginFooter');
const LoginPage = sdk.getComponent('login.LoginPage');
const InteractiveAuth = sdk.getComponent('structures.InteractiveAuth');
const Spinner = sdk.getComponent("elements.Spinner");
const ServerConfig = sdk.getComponent('views.login.ServerConfig');
@ -385,7 +386,7 @@ module.exports = React.createClass({
);
}
return (
<div className="mx_Login">
<LoginPage>
<div className="mx_Login_box">
<LoginHeader
icon={this.state.teamSelected ?
@ -401,7 +402,7 @@ module.exports = React.createClass({
{ returnToAppJsx }
<LoginFooter />
</div>
</div>
</LoginPage>
);
},
});