crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor positions

Browse Source
This commit is contained in:
Fred Carlsen
2018-12-10 15:43:15 +01:00
parent 7c33f94836
commit 934117bfe4
1 changed files with 51 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
packages/website/ts/@next/pages/about/jobs.tsx
View File

@@ -1,13 +1,61 @@
import * as React from 'react';
import * as _ from 'lodash';
import { Link as ReactRouterLink } from 'react-router-dom';
import styled from 'styled-components';
import { ChapterLink } from 'ts/@next/components/chapter_link';
import { Column, Section, Wrap } from 'ts/@next/components/layout';
import { Link } from 'ts/@next/components/link';
import { Separator } from 'ts/@next/components/separator';
import { SiteWrap } from 'ts/@next/components/siteWrap';
import { Heading, Paragraph } from 'ts/@next/components/text';
interface PositionInterface {
title: string;
location: string;
href: string;
}
const positions: PositionInterface[] = [
{
title: 'Product Designer',
location: 'San Francisco, Remote',
href: '#',
},
{
title: 'Product Designer',
location: 'San Francisco, Remote',
href: '#',
},
{
title: 'Product Designer',
location: 'San Francisco, Remote',
href: '#',
},
{
title: 'Open Positition',
location: "We're always interested in talking to talented people. Send us an application if you think you're the right fit.",
href: '#',
},
];
const Position = ({ position }) => (
<>
<Wrap>
<Column colWidth="1/3">
<Heading size="small">{position.title}</Heading>
</Column>
<Column colWidth="1/3">
<Paragraph isMuted={true}>{position.location}</Paragraph>
</Column>
<Column colWidth="1/3">
<Paragraph><Link href={position.href}>Apply</Link></Paragraph>
</Column>
</Wrap>
<Separator/>
</>
);
export const NextAboutJobs = () => (
<SiteWrap theme="light">
<Section>
@@ -73,6 +121,8 @@ export const NextAboutJobs = () => (
</Wrap>
</Section>
<Separator/>
<Section>
<Wrap>
<Column colWidth="1/3">
@@ -80,30 +130,7 @@ export const NextAboutJobs = () => (
</Column>
<Column colWidth="2/3">
<Wrap>
<Column colWidth="1/3">
<Heading size="small">Product Designer</Heading>
</Column>
<Column colWidth="1/3">
<Paragraph isMuted={true}>San Francisco, Remote</Paragraph>
</Column>
<Column colWidth="1/3">
<Paragraph><Link href="#">Apply</Link></Paragraph>
</Column>
</Wrap>
<Wrap>
<Column colWidth="1/3">
<Heading size="small">Open Positition</Heading>
</Column>
<Column colWidth="1/3">
<Paragraph isMuted={true}>
We're always interested in talking to talented people. Send us an application if you think you're the right fit.
</Paragraph>
</Column>
<Column colWidth="1/3">
<Paragraph><Link href="#">Apply</Link></Paragraph>
</Column>
</Wrap>
{_.map(positions, (position, index) => <Position key={`position-${index}`} position={position} /> )}
</Column>
</Wrap>
</Section>