Move form types to central place.

This commit is contained in:
Paulo Gustavo Veiga 2020-12-02 18:19:27 -08:00
parent 2d9e66f32f
commit 9c8f4734db
7 changed files with 89 additions and 75 deletions

View File

@ -1 +1 @@
[{"/Users/pveiga/repos/wisemapping-react/src/Footer.js":"1","/Users/pveiga/repos/wisemapping-react/src/Header.js":"2","/Users/pveiga/repos/wisemapping-react/src/index.js":"3","/Users/pveiga/repos/wisemapping-react/src/RegistrationApp.js":"4","/Users/pveiga/repos/wisemapping-react/src/LoginApp.js":"5"},{"size":1601,"mtime":1606716377431,"results":"6","hashOfConfig":"7"},{"size":1818,"mtime":1606793242108,"results":"8","hashOfConfig":"7"},{"size":1883,"mtime":1606789677736,"results":"9","hashOfConfig":"7"},{"size":3516,"mtime":1606870582803,"results":"10","hashOfConfig":"7"},{"size":3472,"mtime":1606870845676,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1xegajf",{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/pveiga/repos/wisemapping-react/src/Footer.js",[],"/Users/pveiga/repos/wisemapping-react/src/Header.js",[],"/Users/pveiga/repos/wisemapping-react/src/index.js",[],"/Users/pveiga/repos/wisemapping-react/src/RegistrationApp.js",[],"/Users/pveiga/repos/wisemapping-react/src/LoginApp.js",[]]
[{"/Users/pveiga/repos/wisemapping-react/src/Footer.js":"1","/Users/pveiga/repos/wisemapping-react/src/Header.js":"2","/Users/pveiga/repos/wisemapping-react/src/index.js":"3","/Users/pveiga/repos/wisemapping-react/src/RegistrationApp.js":"4","/Users/pveiga/repos/wisemapping-react/src/LoginApp.js":"5"},{"size":1601,"mtime":1606716377431,"results":"6","hashOfConfig":"7"},{"size":1823,"mtime":1606961799662,"results":"8","hashOfConfig":"7"},{"size":1883,"mtime":1606789677736,"results":"9","hashOfConfig":"7"},{"size":3892,"mtime":1606881237401,"results":"10","hashOfConfig":"7"},{"size":3495,"mtime":1606881218435,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1xegajf",{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/Users/pveiga/repos/wisemapping-react/src/Footer.js",[],"/Users/pveiga/repos/wisemapping-react/src/Header.js",[],"/Users/pveiga/repos/wisemapping-react/src/index.js",[],"/Users/pveiga/repos/wisemapping-react/src/RegistrationApp.js",[],"/Users/pveiga/repos/wisemapping-react/src/LoginApp.js",[]]

View File

@ -19,7 +19,7 @@ class Header extends React.Component {
if (pageType === 'only-signup') {
text = <span class="nav-center"><FormattedMessage id="header.donthaveaccount" defaultMessage="Don't have an account ?" /></span>;
signUpButton = <SignUpButton/>;
} if (pageType === 'only-signin') {
} else if (pageType === 'only-signin') {
text = <span class="nav-center"><FormattedMessage id="header.haveaccount" defaultMessage="Already have an account?" /></span>;
signUpButton = <SignInButton/>;
} else {

View File

@ -19,7 +19,6 @@ const ConfigStatusMessage = (props) => {
} else {
result = <span></span>;
}
return result;
}
@ -32,12 +31,12 @@ const LoginError = (props) => {
if (errorCode) {
if (errorCode === 3) {
result = (
<div class='error'>
<div class='form-error-dialog'>
<FormattedMessage id="login.userinactive" defaultMessage="Sorry, your account has not been activated yet. You'll receive a notification login.email when it becomes active. Stay tuned!." />
</div>)
} else {
result = (
<div class='error'>
<div class='form-error-dialog'>
<FormattedMessage id="login.error" defaultMessage="The login.email address or login.password you entered is not valid." />
</div>)
}

View File

@ -7,21 +7,33 @@ import ReCAPTCHA from "react-google-recaptcha";
import Header from './Header.js';
import Footer from './Footer.js';
const RegistrationError = (props) => {
return (<span></span>);
const ErrorMessageDialog = (props) => {
let result;
const message = props.message;
if (message) {
const message = "here is a messar ofr error eerera rser wer"
result = <p class='form-error-dialog'>{message}</p>
} else {
result = <span></span>
}
return result;
}
class RegistrationForm extends React.Component {
constructor(props) {
super(props)
this.state = {
errorMsg: ""
}
this.handleChange = this.handleChange.bind(this);
this.handleRecaptchaChange = this.handleRecaptchaChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChange(event) {
this.setState({ value: event.target.value });
}
@ -31,18 +43,21 @@ class RegistrationForm extends React.Component {
}
handleSubmit(event) {
this.setState({ errorMsg: "Error Message" });
event.preventDefault();
}
render() {
const intl = this.props.intl;
const errrMsg = this.state.errorMsg;
return (
<div class="wrapper">
<div class="content">
<h1><FormattedMessage id="registration.become" defaultMessage="Become a member of our comunity" /></h1>
<p><FormattedMessage id="registration.signup" defaultMessage="Signing up is free and just take a moment " /></p>
<RegistrationError />
<ErrorMessageDialog message={errrMsg} />
<form action="/" method="POST" onSubmit={this.handleSubmit}>
<input type="email" name="username" onChange={this.handleChange} placeholder={intl.formatMessage({ id: "registration.email", defaultMessage: "Email" })} required="true" autoComplete="email" />
@ -72,6 +87,7 @@ class RegistrationForm extends React.Component {
const RegistationApp = props => {
const messages = props.messages;
const locale = props.locale;
return (
<IntlProvider locale={locale} defaultLocale='en' messages={messages}>
<div>

View File

@ -209,6 +209,65 @@ nav a {
}
}
input[type=email],
input[type=password],
input[type=text] {
width: 258px;
height: 53px;
padding: 0px 20px;
margin: 10px 20px;
border-radius: 9px;
font-size: 16px;
border: solid 1px #f9a826;
display: block;
margin: 10px auto;
}
input[type=checkbox] {
border: solid 1px #f9a826;
background-color: #f9a826;
}
input[type=submit] {
width: 258px;
height: 53px;
padding: 0px 20px;
margin: 10px 20px;
font-size: 20px;
font-weight: 600;
border-radius: 9px;
border: 0px;
background-color: rgba(255, 168, 0, 0.6);
color: white;
}
input[type=submit]:hover {
background-color: #f9a826;
}
input:placeholder {
color: grey;
}
::-moz-selection {
background: #f7a494;
}
::selection {
background: #f7a494;
}
.form-error-dialog {
margin: 10px auto;
width: 260px;
font-size: 15px;
border: 2px solid #e97450;
padding: 10px 10px;
border-radius: 9px;
color: white;
background-color: #e78b72;
}
/* Buttons */

View File

@ -37,7 +37,12 @@
color: white;
}
input[type=submit]:hover {
.content input[type=checkbox] {
border: solid 1px #f9a826;
background-color: #f9a826;
}
.content input[type=submit]:hover {
background-color: #f9a826;
}
@ -49,11 +54,6 @@ input[type=submit]:hover {
font-size: 14px;
}
.content input[type=checkbox] {
border: solid 1px #f9a826;
background-color: #f9a826;
}
.content a {
color: #f9a826;
font-size: 15px;
@ -72,14 +72,4 @@ input[type=submit]:hover {
color: white;
padding: 15px 30px;
border-radius: 10px;
}
.error {
margin: 10px auto;
width: 260px;
font-size: 14px;
background-color: #e97450;
padding: 10px 10px;
border-radius: 9px;
color: white;
}

View File

@ -10,33 +10,6 @@
text-align: center;
}
.content input[type=email],
.content input[type=password],
.content input[type=text] {
width: 258px;
height: 53px;
padding: 0px 20px;
margin: 10px 20px;
border-radius: 9px;
font-size: 16px;
border: solid 1px #f9a826;
display: block;
margin: 10px auto;
}
.content input[type=submit] {
width: 258px;
height: 53px;
padding: 0px 20px;
margin: 10px 20px;
font-size: 20px;
font-weight: 600;
border-radius: 9px;
border: 0px;
background-color: rgba(255, 168, 0, 0.6);
color: white;
}
form>p,
form>div {
font-size: 13px;
@ -44,23 +17,10 @@ form>div {
margin: auto;
}
input[type=submit]:hover {
background-color: #f9a826;
}
.content input:placeholder {
color: grey;
}
.content label {
font-size: 14px;
}
.content input[type=checkbox] {
border: solid 1px #f9a826;
background-color: #f9a826;
}
.content a {
color: #f9a826;
font-size: 15px;
@ -79,14 +39,4 @@ input[type=submit]:hover {
color: white;
padding: 15px 30px;
border-radius: 10px;
}
.error {
margin: 10px auto;
width: 260px;
font-size: 14px;
background-color: #e97450;
padding: 10px 10px;
border-radius: 9px;
color: white;
}