Add styling to preview jobs

Add cursor pointer
This commit is contained in:
Berkeley Martinez
2015-10-15 22:24:05 -07:00
parent 1ed576bee1
commit 6512170e9b
4 changed files with 44 additions and 24 deletions

View File

@ -5,3 +5,8 @@
a.jobs-list-highlight:hover { a.jobs-list-highlight:hover {
background-color: #ffc background-color: #ffc
} }
.jobs-list {
cursor: pointer;
cursor: hand;
}

View File

@ -1,4 +1,5 @@
import React, { PropTypes } from 'react'; import React, { PropTypes } from 'react';
import classnames from 'classnames';
import { ListGroup, ListGroupItem } from 'react-bootstrap'; import { ListGroup, ListGroupItem } from 'react-bootstrap';
import moment from 'moment'; import moment from 'moment';
@ -22,9 +23,15 @@ export default React.createClass({
isHighlighted, isHighlighted,
postedOn postedOn
}) => { }) => {
const className = classnames({
'jobs-list': true,
'jobs-list-highlight': isHighlighted
});
return ( return (
<ListGroupItem <ListGroupItem
className={ isHighlighted ? 'jobs-list-highlight' : '' } className={ className }
onClick={ () => handleClick(id) }> onClick={ () => handleClick(id) }>
<div> <div>
<h4 style={{ display: 'inline-block' }}> <h4 style={{ display: 'inline-block' }}>

View File

@ -14,7 +14,7 @@ import {
Col, Col,
Input, Input,
Row, Row,
Well Panel
} from 'react-bootstrap'; } from 'react-bootstrap';
import { import {
@ -197,8 +197,10 @@ export default contain({
return ( return (
<div> <div>
<Row> <Row>
<Col> <Col
<Well className='text-center'> md={ 10 }
mdOffset={ 1 }>
<Panel className='text-center'>
<h1>Create Your Job Post</h1> <h1>Create Your Job Post</h1>
<form <form
className='form-horizontal' className='form-horizontal'
@ -317,7 +319,7 @@ export default contain({
</Col> </Col>
</Row> </Row>
</form> </form>
</Well> </Panel>
</Col> </Col>
</Row> </Row>
</div> </div>

View File

@ -1,5 +1,5 @@
import React, { PropTypes } from 'react'; import React, { PropTypes } from 'react';
import { Well, Button, Row } from 'react-bootstrap'; import { Panel, Button, Row, Col } from 'react-bootstrap';
import { contain } from 'thundercats-react'; import { contain } from 'thundercats-react';
import ShowJob from './ShowJob.jsx'; import ShowJob from './ShowJob.jsx';
@ -29,24 +29,30 @@ export default contain(
<div> <div>
<ShowJob job={ job } /> <ShowJob job={ job } />
<Row> <Row>
<Well> <Col
<Button md={ 10 }
block={ true } mdOffset={ 1 }
className='signup-btn' xs={ 12 }>
onClick={ () => { <Panel>
jobActions.saveJobToDb({ <Button
goTo: '/jobs/new/check-out', block={ true }
job className='signup-btn'
}); onClick={ () => {
}}> jobActions.saveJobToDb({
Looks great! Let's Check Out goTo: '/jobs/new/check-out',
</Button> job
<Button });
block={ true } }}>
onClick={ () => appActions.goBack() } >
Head back and make edits Looks great! Let's Check Out
</Button> </Button>
</Well> <Button
block={ true }
onClick={ () => appActions.goBack() } >
Head back and make edits
</Button>
</Panel>
</Col>
</Row> </Row>
</div> </div>
); );