45 lines
1.5 KiB
TypeScript
45 lines
1.5 KiB
TypeScript
import React from 'react';
|
|
import Card from 'react-bootstrap/Card';
|
|
import { Placeholder } from 'react-bootstrap';
|
|
import JobTags from './JobTags';
|
|
import { Job } from '@/PersonalDataTypes';
|
|
import md from '../Markdown';
|
|
|
|
export type Props = Job & {
|
|
heading?: string
|
|
};
|
|
|
|
export function JobCardPlaceholder() {
|
|
return <Card className='job-card'>
|
|
<Card.Body>
|
|
<Placeholder as={Card.Title} animation="glow">
|
|
<Placeholder xs={6} />
|
|
</Placeholder>
|
|
<Placeholder as={Card.Text} animation="glow">
|
|
<Placeholder xs={7} /> <Placeholder xs={4} /> <Placeholder xs={5} />{' '}
|
|
<Placeholder xs={4} /> <Placeholder xs={3} />
|
|
</Placeholder>
|
|
</Card.Body>
|
|
</Card>
|
|
}
|
|
|
|
export default function JobCard(props: Props) {
|
|
return (
|
|
<Card className='job-card'>
|
|
{props.heading && (
|
|
<Card.Header>{props.heading}</Card.Header>
|
|
)}
|
|
<Card.Body>
|
|
<Card.Title>{props.position}</Card.Title>
|
|
<Card.Subtitle>
|
|
{props.company && <span className='company-name'>{props.company}</span>}
|
|
{props.company && props.timerange && <span>, </span>}
|
|
{props.timerange && <span className='timerange'>{props.timerange}</span>}
|
|
</Card.Subtitle>
|
|
<Card.Text className='multiline'>{md(props.description)}</Card.Text>
|
|
{props.tags && <JobTags tags={props.tags} />}
|
|
</Card.Body>
|
|
</Card>
|
|
);
|
|
}
|