[#140654507] #15 #16 update Modal for register

assets/css/custom.css

 
 
-html, body{
+body{
   padding: 0;
   height: auto;
   width: auto;
+  background-color: black;
 }
 
 .center{
@@ -18,10 +19,14 @@ html, body{
 }
 body {
   font: 300 14px/1.4 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  background: #eee;
   margin: 0;
   padding: 0;
 }
+
+.halamanLowongan{
+
+}
+
 .tabs {
   margin-top: 100px;
   margin-left:  150px;
@@ -29,6 +34,7 @@ body {
   background: #fff;
   border: 1px solid #e5e5e5;
   border-radius: 3px;
+  margin-bottom: 30px;
 }
 .tabs__labels {
   margin: 0;

assets/js/CompanyRegister.jsx

@@ -40,6 +40,7 @@ export default class companyRegister extends React.Component {
                         icon={{ name: 'attach', circular: true, link: true }}
                         placeholder='attach logo'
                         required
+                        type="File"
                       />
                     </Form.Field>
                     <Form.Field required>

assets/js/Login.jsx

 import React from 'react';
-import { Grid, Segment } from 'semantic-ui-react';
+import { Grid, Segment, Button, Header, Icon, Modal, Form, Input, TextArea, } from 'semantic-ui-react';
 import LoginForm from './components/LoginForm';
 
 export default class Login extends React.Component {
@@ -24,6 +24,8 @@ export default class Login extends React.Component {
           <LoginForm type="company" header="Company Login" imgSrc="logo.png" imgSize="small" />
           {this.props.children}
         </Segment>
+        <RegisterModal/>
+
       </Grid.Column>
 
       <Grid.Column>
@@ -38,3 +40,65 @@ export default class Login extends React.Component {
   )
 }
 
+const RegisterModal = () => (
+  <Modal trigger={<Button>Show Modal</Button>} closeIcon='close'>
+    <Header icon='archive' content='Archive Old Messages' />
+    <Modal.Content>
+
+         <Form>
+                     <Header as='h2' icon textAlign='center'>
+                      <Icon name='signup' circular />
+                      <Header.Content>
+                        Register
+                      </Header.Content>
+                    </Header>
+                    <Form.Field required>
+                      <label>Email</label>
+                      <Input  type="text" id="email" icon='user' iconPosition='left' placeholder="email" required />
+                    </Form.Field>
+                    <Form.Field required>
+                      <label>Password</label>
+                      <Input type='password' id="password"  icon='key' iconPosition='left' placeholder="password"  required />
+                    </Form.Field>
+                    <Form.Field required>
+                      <label>Konfirmasi Password</label>
+                      <Input type='password' icon="key" iconPosition="left" placeholder='password'  required />
+                    </Form.Field>
+
+                    <Form.Field required>
+                      <label>Nama Perusahaan</label>
+                      <Input placeholder='Nama Perusahaan' required />
+                    </Form.Field>
+                     <Form.Field required>
+                      <label>Logo</label>
+                     <Input
+                        icon={{ name: 'attach', circular: true, link: true }}
+                        placeholder='attach logo'
+                        required
+                        type="File"
+                      />
+                    </Form.Field>
+                    <Form.Field required>
+                      <label>Deskripsi</label>
+                       <TextArea placeholder='Tell us more'  required/>
+                    </Form.Field>
+                     <Form.Field required>
+                      <label>Alamat</label>
+                      <Input placeholder='Alamat' required />
+                    </Form.Field>
+                     <Form.Field required>
+                      <label>Kota</label>
+                      <Input placeholder='Kota' required />
+                    </Form.Field>
+                     <Form.Field required>
+                      <label>Provinsi</label>
+                      <Input placeholder='Provinsi' required />
+                    </Form.Field >
+
+                 </Form>
+    </Modal.Content>
+    <Modal.Actions>
+       <Button type='submit' floated='right' color='blue'>Submit</Button>
+    </Modal.Actions>
+  </Modal>
+)

assets/js/VacancyPage.jsx

@@ -31,7 +31,8 @@ export default class VacancyPage extends React.Component {
   render() {
     const data = [{ data1: 'Software Enggineer' }, { data1: 'System Analyst' }];
 
-    return (<div>
+    return (
+  <div className="halamanLowongan">
       <Tabs selected={0}>
         <Pane label="Semua Lowongan" >
           <VacancyList url="/vacancies/" />
@@ -43,7 +44,8 @@ export default class VacancyPage extends React.Component {
           <VacancyList url="/c" />
         </Pane>
       </Tabs>
-    </div>
+
+  </div>
 
     );
   }

assets/js/components/Vacancy.jsx

@@ -23,7 +23,6 @@ export default class Lowongan extends React.Component {
             <h4>{ this.props.data.company.name }</h4>
             <h5>{ this.props.data.company.address }</h5>
 
-
             <ModalPendaftaran
               id={this.props.data.id} data={{ header: this.props.data.name,
               description: this.props.data.description }} buttonTitle="Daftar" />