[#42] Page vacancy company

assets/css/custom.css

@@ -244,6 +244,10 @@ card .formRegis{
   margin-right: 10%;
 }
 
+.ui.segment.paginationCompany{
+  margin-left: 10%;
+  margin-right: 10%;
+}
 
 .admin-bar{
   margin: 0;

assets/js/VacancyPage.jsx

 import React from 'react';
+import { Segment } from 'semantic-ui-react';
 import Tabs from './components/Tabs';
 import Pane from './components/Pane';
 import VacancyList from './components/VacancyList';
@@ -77,17 +78,19 @@ export default class VacancyPage extends React.Component {
       );
     } else if (this.props.user.role === 'company' || this.props.user.role === 'admin') {
       return (
-        <Pagination
-          url={`/companies/${this.state.id}/vacancies/`}
-          child={
-            <VacancyList
-              key={1}
-              user={this.props.user}
-              userId={this.state.id}
-            />
+        <Segment className="paginationCompany">
+          <Pagination
+            url={`/companies/${this.state.id}/vacancies/`}
+            child={
+              <VacancyList
+                key={1}
+                user={this.props.user}
+                userId={this.state.id}
+              />
           }
-          error="Anda belum diverifikasi. Harap hubungi admin"
-        />
+            error="Anda belum diverifikasi. Harap hubungi admin"
+          />
+        </Segment>
       );
     }
 

assets/js/components/CompanyVacancy.jsx

@@ -23,6 +23,7 @@ export default class CompanyVacancy extends React.Component {
 
   render() {
     return (
+
       <Item className="applicantItems">
         <Item.Image src={this.props.data.company.logo ? this.props.data.company.logo : defaultImage} size="small" />
         <Item.Content>

assets/js/components/VacancyList.jsx

 import React from 'react';
-import { Item, Button, Grid } from 'semantic-ui-react';
+import { Item, Button, Grid, Segment } from 'semantic-ui-react';
 import { Link } from 'react-router';
 import Vacancy from './Vacancy';
 import CompanyVacancy from './CompanyVacancy';
@@ -54,11 +54,17 @@ export default class VacancyList extends React.Component {
       );
     }
 
-    return this.state.vacancies.map(vacancy => (<CompanyVacancy
-      key={vacancy.id}
-      data={vacancy}
-      deleteCallback={() => this.deleteVacancy(vacancy.id)}
-    />),
+    return this.state.vacancies.map(vacancy => (
+
+        <Item.Group relaxed style={{ width: '100%' }}>
+          <CompanyVacancy
+            key={vacancy.id}
+            data={vacancy}
+            deleteCallback={() => this.deleteVacancy(vacancy.id)}
+          />
+        </Item.Group>
+
+        ),
     );
   }