Update open positions section

packages/website/ts/components/ui/text.tsx

@@ -10,6 +10,7 @@ export interface TextProps {
     Tag?: TextTag;
     fontSize?: string;
     fontFamily?: string;
+    fontStyle?: string;
     fontColor?: string;
     lineHeight?: string;
     minHeight?: string;
@@ -28,6 +29,7 @@ const PlainText: React.StatelessComponent<TextProps> = ({ children, className, o
 
 export const Text = styled(PlainText)`
     font-family: ${props => props.fontFamily};
+    font-style: ${props => props.fontStyle};
     font-weight: ${props => props.fontWeight};
     font-size: ${props => props.fontSize};
     text-decoration-line: ${props => props.textDecorationLine};
@@ -44,6 +46,7 @@ export const Text = styled(PlainText)`
 
 Text.defaultProps = {
     fontFamily: 'Roboto',
+    fontStyle: 'normal',
     fontWeight: 400,
     fontColor: colors.black,
     fontSize: '15px',

packages/website/ts/pages/jobs/open_positions.tsx

@@ -9,6 +9,7 @@ import { colors } from 'ts/style/colors';
 import { styled } from 'ts/style/theme';
 import { ScreenWidths, WebsiteBackendJobInfo } from 'ts/types';
 import { backendClient } from 'ts/utils/backend_client';
+import { constants } from 'ts/utils/constants';
 import { utils } from 'ts/utils/utils';
 
 const TABLE_ROW_MIN_HEIGHT = 100;
@@ -72,16 +73,30 @@ export class OpenPositions extends React.Component<OpenPositionsProps, OpenPosit
     private _renderTable(): React.ReactNode {
         return (
             <Container width="100%">
-                {_.map(this.state.jobInfos, jobInfo => {
-                    return (
-                        <JobInfoTableRow
-                            key={jobInfo.id}
-                            screenWidth={this.props.screenWidth}
-                            jobInfo={jobInfo}
-                            onClick={this._openJobInfoUrl.bind(this, jobInfo)}
-                        />
-                    );
-                })}
+                <div>
+                    {_.map(this.state.jobInfos, jobInfo => {
+                        return (
+                            <JobInfoTableRow
+                                key={jobInfo.id}
+                                screenWidth={this.props.screenWidth}
+                                jobInfo={jobInfo}
+                                onClick={this._openJobInfoUrl.bind(this, jobInfo)}
+                            />
+                        );
+                    })}
+                </div>
+                <Container className="center" marginTop="70px">
+                    <Text fontStyle="italic" fontSize="14px">
+                        Interested in telling us why you'd be a valuable addition to the team outside of the positions
+                        listed above?{' '}
+                        <a
+                            style={{ color: colors.mediumBlue, textDecoration: 'none' }}
+                            href={`mailto:${constants.EMAIL_JOBS}`}
+                        >
+                            Email us!
+                        </a>
+                    </Text>
+                </Container>
             </Container>
         );
     }

packages/website/ts/utils/constants.ts

@@ -41,6 +41,7 @@ export const constants = {
     TAKER_FEE: new BigNumber(0),
     TESTNET_NAME: 'Kovan',
     NUMERAL_USD_FORMAT: '$0,0.00',
+    EMAIL_JOBS: 'jobs@0xproject.com',
     PROJECT_URL_ETHFINEX: 'https://www.ethfinex.com/',
     PROJECT_URL_AMADEUS: 'http://amadeusrelay.org',
     PROJECT_URL_DDEX: 'https://ddex.io',