Rename LoginPage, Header, Footer views to Auth*

This commit is contained in:
J. Ryan Stinnett 2019-01-21 18:33:17 -06:00
parent c7354f483b
commit 3bd765f63f
12 changed files with 126 additions and 73 deletions

View file

@ -24,6 +24,9 @@
@import "./structures/_ViewSource.scss";
@import "./structures/auth/_Login.scss";
@import "./views/auth/_AuthButtons.scss";
@import "./views/auth/_AuthFooter.scss";
@import "./views/auth/_AuthHeader.scss";
@import "./views/auth/_AuthPage.scss";
@import "./views/auth/_InteractiveAuthEntryComponents.scss";
@import "./views/auth/_ServerConfig.scss";
@import "./views/avatars/_BaseAvatar.scss";

View file

@ -1,5 +1,6 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -14,23 +15,6 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_Login {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: auto;
}
.mx_Login h2 {
font-weight: 300;
margin-top: 32px;
margin-bottom: 20px;
}
.mx_Login_box {
width: 300px;
min-height: 450px;
@ -39,16 +23,6 @@ limitations under the License.
margin: auto;
}
.mx_Login_logo {
text-align: center;
height: 150px;
margin-bottom: 45px;
}
.mx_Login_logo img {
max-height: 100%
}
.mx_Login_support {
text-align: center;
font-size: 13px;
@ -115,19 +89,6 @@ limitations under the License.
color: $primary-fg-color;
}
.mx_Login_links {
display: block;
text-align: center;
margin-top: 15px;
width: 100%;
font-size: 13px;
opacity: 0.8;
}
.mx_Login_links a:link {
color: $primary-fg-color;
}
.mx_Login_prompt {
padding-top: 15px;
padding-bottom: 15px;

View file

@ -0,0 +1,28 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthFooter {
display: block;
text-align: center;
margin-top: 15px;
width: 100%;
font-size: 13px;
opacity: 0.8;
}
.mx_AuthFooter a:link {
color: $primary-fg-color;
}

View file

@ -0,0 +1,25 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthHeader_logo {
text-align: center;
height: 150px;
margin-bottom: 45px;
}
.mx_AuthHeader_logo img {
max-height: 100%
}

View file

@ -0,0 +1,32 @@
/*
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AuthPage {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: auto;
}
.mx_AuthPage h2 {
font-weight: 300;
margin-top: 32px;
margin-bottom: 20px;
}

View file

@ -183,9 +183,9 @@ module.exports = React.createClass({
},
render: function() {
const LoginPage = sdk.getComponent("auth.LoginPage");
const LoginHeader = sdk.getComponent("auth.LoginHeader");
const LoginFooter = sdk.getComponent("auth.LoginFooter");
const AuthPage = sdk.getComponent("auth.AuthPage");
const AuthHeader = sdk.getComponent("auth.AuthHeader");
const AuthFooter = sdk.getComponent("auth.AuthFooter");
const ServerConfig = sdk.getComponent("auth.ServerConfig");
const Spinner = sdk.getComponent("elements.Spinner");
@ -272,7 +272,7 @@ module.exports = React.createClass({
{ _t('Create an account') }
</a>
<LanguageSelector />
<LoginFooter />
<AuthFooter />
</div>
</div>
);
@ -280,12 +280,12 @@ module.exports = React.createClass({
return (
<LoginPage>
<AuthPage>
<div className="mx_Login_box">
<LoginHeader />
<AuthHeader />
{ resetPasswordJsx }
</div>
</LoginPage>
</AuthPage>
);
},
});

View file

@ -515,9 +515,9 @@ module.exports = React.createClass({
render: function() {
const Loader = sdk.getComponent("elements.Spinner");
const LoginPage = sdk.getComponent("auth.LoginPage");
const LoginHeader = sdk.getComponent("auth.LoginHeader");
const LoginFooter = sdk.getComponent("auth.LoginFooter");
const AuthPage = sdk.getComponent("auth.AuthPage");
const AuthHeader = sdk.getComponent("auth.AuthHeader");
const AuthFooter = sdk.getComponent("auth.AuthFooter");
const ServerConfig = sdk.getComponent("auth.ServerConfig");
const loader = this.state.busy ? <div className="mx_Login_loader"><Loader /></div> : null;
@ -558,9 +558,9 @@ module.exports = React.createClass({
const LanguageSelector = sdk.getComponent('structures.auth.LanguageSelector');
return (
<LoginPage>
<AuthPage>
<div className="mx_Login_box">
<LoginHeader />
<AuthHeader />
<div>
{ header }
{ errorTextSection }
@ -571,10 +571,10 @@ module.exports = React.createClass({
</a>
{ loginAsGuestJsx }
<LanguageSelector />
<LoginFooter />
<AuthFooter />
</div>
</div>
</LoginPage>
</AuthPage>
);
},
});

View file

@ -60,12 +60,12 @@ module.exports = React.createClass({
render: function() {
const ChangeDisplayName = sdk.getComponent('settings.ChangeDisplayName');
const ChangeAvatar = sdk.getComponent('settings.ChangeAvatar');
const LoginPage = sdk.getComponent('auth.LoginPage');
const LoginHeader = sdk.getComponent('auth.LoginHeader');
const AuthPage = sdk.getComponent('auth.AuthPage');
const AuthHeader = sdk.getComponent('auth.AuthHeader');
return (
<LoginPage>
<AuthPage>
<div className="mx_Login_box">
<LoginHeader />
<AuthHeader />
<div className="mx_Login_profile">
{ _t('Set a display name:') }
<ChangeDisplayName />
@ -76,7 +76,7 @@ module.exports = React.createClass({
{ this.state.errorString }
</div>
</div>
</LoginPage>
</AuthPage>
);
},
});

View file

@ -396,9 +396,9 @@ module.exports = React.createClass({
},
render: function() {
const LoginHeader = sdk.getComponent('auth.LoginHeader');
const LoginFooter = sdk.getComponent('auth.LoginFooter');
const LoginPage = sdk.getComponent('auth.LoginPage');
const AuthHeader = sdk.getComponent('auth.AuthHeader');
const AuthFooter = sdk.getComponent('auth.AuthFooter');
const AuthPage = sdk.getComponent('auth.AuthPage');
const InteractiveAuth = sdk.getComponent('structures.InteractiveAuth');
const Spinner = sdk.getComponent("elements.Spinner");
const ServerConfig = sdk.getComponent('views.auth.ServerConfig');
@ -474,9 +474,9 @@ module.exports = React.createClass({
const LanguageSelector = sdk.getComponent('structures.auth.LanguageSelector');
return (
<LoginPage>
<AuthPage>
<div className="mx_Login_box">
<LoginHeader
<AuthHeader
icon={this.state.teamSelected ?
this.props.teamServerConfig.teamServerURL + "/static/common/" +
this.state.teamSelected.domain + "/icon.png" :
@ -487,9 +487,9 @@ module.exports = React.createClass({
{ signIn }
{ errorText }
<LanguageSelector />
<LoginFooter />
<AuthFooter />
</div>
</LoginPage>
</AuthPage>
);
},
});

View file

@ -1,5 +1,6 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -20,11 +21,11 @@ import { _t } from '../../../languageHandler';
import React from 'react';
module.exports = React.createClass({
displayName: 'LoginFooter',
displayName: 'AuthFooter',
render: function() {
return (
<div className="mx_Login_links">
<div className="mx_AuthFooter">
<a href="https://matrix.org">{ _t("powered by Matrix") }</a>
</div>
);

View file

@ -1,5 +1,6 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2019 New Vector Ltd
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -19,12 +20,14 @@ limitations under the License.
const React = require('react');
module.exports = React.createClass({
displayName: 'LoginHeader',
displayName: 'AuthHeader',
render: function() {
return (
<div className="mx_Login_logo">
Matrix
<div className="mx_AuthHeader">
<div className="mx_AuthHeader_logo">
Matrix
</div>
</div>
);
},

View file

@ -20,11 +20,11 @@ limitations under the License.
const React = require('react');
module.exports = React.createClass({
displayName: 'LoginPage',
displayName: 'AuthPage',
render: function() {
return (
<div className="mx_Login">
<div className="mx_AuthPage">
{ this.props.children }
</div>
);