diff --git a/assets/css/custom.css b/assets/css/custom.css
index 67735bc6ff6cd095695fd077e68bb3822988627f..706d9ddfbf5b7698ac2d0fa64d316c4f6c1526f3 100755
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -115,7 +115,7 @@ font-size: 32px;
 }
 .daftar{
   float: right;
-  margin-top:10px; 
+  margin-top:10px;
 }
 
 .coverLetter{
@@ -132,7 +132,7 @@ font-size: 32px;
 
 .registerForm{
   margin: 0 auto;
-  padding:50px;
+  /*padding:50px;*/
   background-color: #3B8686;
 }
 
@@ -148,11 +148,6 @@ h5{
   color: black;
 }
 
-textarea{
-  width: 800px !important;
-  height: 160px !important;
-}
-
 .note {
   color: gray;
   margin: 8px 0;
diff --git a/assets/js/components/ModalAlert.jsx b/assets/js/components/ModalAlert.jsx
index de5e94f2950c526ebe1a1c02469dac30b6b3e1c6..e5c723ab433ac5d64f2bbd95cb81e3361366a08a 100644
--- a/assets/js/components/ModalAlert.jsx
+++ b/assets/js/components/ModalAlert.jsx
@@ -31,17 +31,20 @@ export default class ModalAlert extends React.Component {
     this.setState({ open: false });
   };
 
-  render = () => (
-    <Modal open={this.state.open} basic size="small">
-      <Header icon="warning sign" content={this.state.header} />
-      <Modal.Content>
-        <p>{this.state.content}</p>
-      </Modal.Content>
-      <Modal.Actions>
-        <Button color="green" inverted onClick={this.close}>
-          <Icon name="checkmark" /> OK
-        </Button>
-      </Modal.Actions>
-    </Modal>
-  );
+  render = () => {
+    const style = { 'white-space': 'pre-wrap' };
+    return (
+      <Modal open={this.state.open} basic size="small">
+        <Header icon="warning sign" content={this.state.header} />
+        <Modal.Content>
+          <p style={style}>{this.state.content}</p>
+        </Modal.Content>
+        <Modal.Actions>
+          <Button color="green" inverted onClick={this.close}>
+            <Icon name="checkmark" /> OK
+          </Button>
+        </Modal.Actions>
+      </Modal>
+    );
+  };
 }
diff --git a/assets/js/components/RegisterModal.jsx b/assets/js/components/RegisterModal.jsx
index bbcbc9d76d996fe7fefb13720127ad1d18e2a165..b5e583e449034aeba5a8744c99f7e4d9bf7fbd7f 100644
--- a/assets/js/components/RegisterModal.jsx
+++ b/assets/js/components/RegisterModal.jsx
@@ -90,7 +90,7 @@ export default class RegisterModal extends React.Component {
           </Form.Field>
           <Form.Field required>
             <label htmlFor="description">Deskripsi</label>
-            <TextArea onChange={this.handleChange} placeholder="Tell us more" name="description" required />
+            <TextArea onChange={this.handleChange} placeholder="Tell us more" name="description" autoHeight required />
           </Form.Field>
           <Form.Field required>
             <label htmlFor="address">Alamat</label>
diff --git a/assets/js/components/Tabs.jsx b/assets/js/components/Tabs.jsx
index 601d8f45e2bf2fd07e2b0aa7f3468b227bb1b464..aa6f75109b1c24f908a9a88043653e465dd60a37 100644
--- a/assets/js/components/Tabs.jsx
+++ b/assets/js/components/Tabs.jsx
@@ -11,10 +11,6 @@ export default class Tabs extends React.Component {
     ]).isRequired,
   };
 
-  static defaultProps = () => ({
-    selected: 0,
-  });
-
   constructor(props) {
     super(props);
     this.state = {
diff --git a/assets/js/components/TopMenu.jsx b/assets/js/components/TopMenu.jsx
index ad5b6bed5151a807eaffa37acabe83e5511864c4..43319101a03cefeb8bdcadaf9be8db0b7cd4a573 100644
--- a/assets/js/components/TopMenu.jsx
+++ b/assets/js/components/TopMenu.jsx
@@ -7,15 +7,15 @@ import Storage from '../lib/Storage';
 
 export default class TopMenu extends React.Component {
 
-  state = { activeItem: 'home' };
-    handleItemClick = (e, { name }) => this.setState({ activeItem: name });
-
   constructor(props) {
     super(props);
     /* istanbul ignore next */
+    this.state = { activeItem: 'home' };
     this.logout = this.logout.bind(this);
   }
 
+  handleItemClick = (e, { name }) => this.setState({ activeItem: name });
+
   logout = () => {
     Server.get('/api-auth/logout/?next=/', true).then(() => {
       Storage.clear();
diff --git a/assets/js/components/VacancyList.jsx b/assets/js/components/VacancyList.jsx
index c8c222114cb81dd0cd40055082fb15665ca7b0aa..412f4cc90dd5cc23df8850b13b27c03e73a23139 100644
--- a/assets/js/components/VacancyList.jsx
+++ b/assets/js/components/VacancyList.jsx
@@ -3,6 +3,7 @@ import { Segment, Item, Button } from 'semantic-ui-react';
 import Vacancy from './Vacancy';
 import CompanyVacancy from './CompanyVacancy';
 import Server from '../lib/Server';
+import {Link} from "react-router";
 
 export default class VacancyList extends React.Component {
 
@@ -73,7 +74,7 @@ export default class VacancyList extends React.Component {
       return (
         <div>
           <Button icon="eye" secondary labelPosition="left" content="Lihat Semua Pendaftar" />
-          <Button icon="add" secondary labelPosition="left" content="Tambah Lowongan Baru" />
+          <Button as={Link} to="/buat-lowongan" icon="add" secondary labelPosition="left" content="Tambah Lowongan Baru" />
         </div>
       );
     }
@@ -82,11 +83,11 @@ export default class VacancyList extends React.Component {
   }
 
   render = () => (
-  <div>
+    <div>
       { this.companyHeader() }
       <Item.Group relaxed>
         { this.generateVacancies() }
       </Item.Group>
-  </div>
+    </div>
   );
 }
diff --git a/core/templates/core/index.html b/core/templates/core/index.html
index 4c14575b552233b6c12fefd25d56f13c037f2c8d..b15d9a2c9065ff9db99bf69bac81afd41914bbbc 100755
--- a/core/templates/core/index.html
+++ b/core/templates/core/index.html
@@ -8,6 +8,7 @@
     <title>Yuk Cari Tempat Kape :)</title>
     <link rel="stylesheet" href="{% static 'css/custom.css' %}"/>
     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css"/>
+    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/react-datepicker/0.44.0/react-datepicker.min.css"/>
     <link rel="icon" type="image/png" href="{% static 'img/logo-sm.png'%}" sizes="32x32" />
   </head>