Commit ad09bdf6a15304f634a70f3ad78eed7628b78b55

Authored by ajaiprakash
1 parent eda2656b20
Exists in master

Fixed a styling bug

imports/client/views/nonOrg/enter/SignupView.js
1 import React from 'react'; 1 import React from 'react';
2 import { Link } from 'react-router'; 2 import { Link } from 'react-router';
3 import { Row, Col, FormGroup, 3 import { Row, Col, FormGroup,
4 ControlLabel, FormControl, 4 ControlLabel, FormControl,
5 InputGroup, Button } from 'react-bootstrap'; 5 InputGroup, Button } from 'react-bootstrap';
6 import handleSignup from './signup'; 6 import handleSignup from './signup';
7 import { Orgs } from '/imports/collections/orgs/index'; 7 import { Orgs } from '/imports/collections/orgs/index';
8 import './signup.css'; 8 import './signup.css';
9 9
10 export default class Signup extends React.Component { 10 export default class Signup extends React.Component {
11 constructor(props) { 11 constructor(props) {
12 super(props); 12 super(props);
13 this.state = { 13 this.state = {
14 orgSlug: "" 14 orgSlug: ""
15 }; 15 };
16 } 16 }
17 componentWillMount(){ 17 componentWillMount(){
18 Meteor.subscribe('allOrgsSlug'); 18 Meteor.subscribe('allOrgsSlug');
19 } 19 }
20 20
21 componentDidMount() { 21 componentDidMount() {
22 handleSignup({ component: this }); 22 handleSignup({ component: this });
23 } 23 }
24 handleChange(e) { 24 handleChange(e) {
25 this.setState({ orgSlug: e.target.value }); 25 this.setState({ orgSlug: e.target.value });
26 } 26 }
27 handleSubmit(event) { 27 handleSubmit(event) {
28 event.preventDefault(); 28 event.preventDefault();
29 } 29 }
30 checkExistingOrgSlug() { 30 checkExistingOrgSlug() {
31 if(this.state.orgSlug==""){return null} 31 if(this.state.orgSlug==""){return null}
32 searchOrg = Orgs.find({slug:this.state.orgSlug}).fetch(); 32 searchOrg = Orgs.find({slug:this.state.orgSlug}).fetch();
33 if(searchOrg.length>0){ 33 if(searchOrg.length>0){
34 return "error" 34 return "error"
35 }else{ 35 }else{
36 return "success" 36 return "success"
37 } 37 }
38 } 38 }
39 render() { 39 render() {
40 return ( 40 return (
41 <div className="Signup"> 41 <div className="Signup">
42 <Row> 42 <Row>
43 <Col md={ 12 }> 43 <Col md={ 12 }>
44 <h4 className="page-header">Sign Up</h4> 44 <h4 className="page-header">Sign Up</h4>
45 <form 45 <form
46 ref={ form => (this.signupForm = form) } 46 ref={ form => (this.signupForm = form) }
47 onSubmit={ this.handleSubmit } 47 onSubmit={ this.handleSubmit }
48 > 48 >
49 <Row> 49 <Row>
50 <Col xs={ 10 } sm={ 10 }> 50 <Col xs={ 10 } sm={ 10 }>
51 <FormGroup controlId="orgSlugField" validationState={this.checkExistingOrgSlug()}> 51 <FormGroup controlId="orgSlugField" validationState={this.checkExistingOrgSlug()}>
52 <ControlLabel>Organisation URL</ControlLabel> 52 <ControlLabel>Organisation URL</ControlLabel>
53 <InputGroup> 53 <InputGroup>
54 <FormControl 54 <FormControl
55 type ="text" 55 type ="text"
56 ref ="orgSlug" 56 ref ="orgSlug"
57 name ="orgSlug" 57 name ="orgSlug"
58 placeholder ="Organisation URL" 58 placeholder ="Organisation URL"
59 onChange = {(e) => this.handleChange(e)} 59 onChange = {(e) => this.handleChange(e)}
60 /> 60 />
61 <InputGroup.Addon>@yd.com</InputGroup.Addon> 61 <InputGroup.Addon>@yd.com</InputGroup.Addon>
62 </InputGroup> 62 </InputGroup>
63 </FormGroup> 63 </FormGroup>
64 </Col> 64 </Col>
65 </Row> 65 </Row>
66 <Row> 66 <Row>
67 <Col xs={ 6 } sm={ 6 }> 67 <Col xs={ 6 } sm={ 6 }>
68 <FormGroup> 68 <FormGroup>
69 <ControlLabel>Organisation Name</ControlLabel> 69 <ControlLabel>Organisation Name</ControlLabel>
70 <FormControl 70 <FormControl
71 type="text" 71 type="text"
72 ref="orgName" 72 ref="orgName"
73 name="orgName" 73 name="orgName"
74 placeholder="Organisation Name" 74 placeholder="Organisation Name"
75 /> 75 />
76 </FormGroup> 76 </FormGroup>
77 </Col> 77 </Col>
78 </Row> 78 </Row>
79 <Row> 79 <Row>
80 <Col xs={ 6 } sm={ 6 }> 80 <Col xs={ 6 } sm={ 6 }>
81 <FormGroup> 81 <FormGroup>
82 <ControlLabel>First Name</ControlLabel> 82 <ControlLabel>First Name</ControlLabel>
83 <FormControl 83 <FormControl
84 type="text" 84 type="text"
85 ref="firstName" 85 ref="firstName"
86 name="firstName" 86 name="firstName"
87 placeholder="First Name" 87 placeholder="First Name"
88 /> 88 />
89 </FormGroup> 89 </FormGroup>
90 </Col> 90 </Col>
91 <Col xs={ 6 } sm={ 6 }> 91 <Col xs={ 6 } sm={ 6 }>
92 <FormGroup> 92 <FormGroup>
93 <ControlLabel>Last Name</ControlLabel> 93 <ControlLabel>Last Name</ControlLabel>
94 <FormControl 94 <FormControl
95 type="text" 95 type="text"
96 ref="lastName" 96 ref="lastName"
97 name="lastName" 97 name="lastName"
98 placeholder="Last Name" 98 placeholder="Last Name"
99 /> 99 />
100 </FormGroup> 100 </FormGroup>
101 </Col> 101 </Col>
102 </Row> 102 </Row>
103 <FormGroup> 103 <FormGroup>
104 <ControlLabel>Email Address</ControlLabel> 104 <ControlLabel>Email Address</ControlLabel>
105 <FormControl 105 <FormControl
106 type="text" 106 type="text"
107 ref="emailAddress" 107 ref="emailAddress"
108 name="emailAddress" 108 name="emailAddress"
109 placeholder="Email Address" 109 placeholder="Email Address"
110 /> 110 />
111 </FormGroup> 111 </FormGroup>
112 <FormGroup> 112 <FormGroup>
113 <ControlLabel>Password</ControlLabel> 113 <ControlLabel>Password</ControlLabel>
114 <FormControl 114 <FormControl
115 type="password" 115 type="password"
116 ref="password" 116 ref="password"
117 name="password" 117 name="password"
118 placeholder="Password" 118 placeholder="Password"
119 /> 119 />
120 </FormGroup> 120 </FormGroup>
121 {/* <Col md={12} */} 121 {/* <Col md={12} */}
122 <Button type="submit" bsStyle="success">Sign Up</Button> 122 <Button type="submit" style="float:center" bsStyle="success">Sign Up</Button>
123 123
124 </form> 124 </form>
125 </Col> 125 </Col>
126 </Row> 126 </Row>
127 </div> 127 </div>
128 ); 128 );
129 } 129 }
130 } 130 }
131 131
imports/client/views/nonOrg/enter/signup.css
1 .Signup 1 .Signup
2 { 2 {
3 background-color: white; 3 background-color: white;
4 margin: auto; 4 margin: auto;
5 width: 40%; 5 width: 40%;
6 border: 3px solid #73AD21; 6 border: 3px solid #73AD21;
7 padding: 10px; 7 padding: 10px;
8 } 8 }
9 9
10 .page-header .bheader 10 .page-header
11 { 11 {
12 text-align: center; 12 text-align: center;
13 } 13 }
14 14