Rework values section

2 files changed, 13 insertions, 44 deletions

diff --git a/packages/website/ts/pages/jobs/bulleted_item.tsx b/packages/website/ts/pages/jobs/bulleted_item.tsx
index ae7385b90..9dc4fe4a3 100644
--- a/packages/website/ts/pages/jobs/bulleted_item.tsx
+++ b/packages/website/ts/pages/jobs/bulleted_item.tsx
@@ -7,9 +7,9 @@ export interface BulletedItemProps {
     height?: number;
 }
 export const BulletedItem = (props: BulletedItemProps) => {
-    const height = props.height || 150;
+    const minHeight = props.height || 150;
     return (
-        <div className="flex" style={{ height }}>
+        <div className="flex" style={{ minHeight }}>
             <svg className="flex-none px2" height="26" width="26">
                 <circle cx="13" cy="13" r="13" fill={props.bulletColor} />
             </svg>
diff --git a/packages/website/ts/pages/jobs/values.tsx b/packages/website/ts/pages/jobs/values.tsx
index 805400583..9bb98d016 100644
--- a/packages/website/ts/pages/jobs/values.tsx
+++ b/packages/website/ts/pages/jobs/values.tsx
@@ -4,65 +4,34 @@ import * as React from 'react';
 
 import { BulletedItem, BulletedItemProps } from 'ts/pages/jobs/bulleted_item';
 
-const ITEMS_COLUMN1: BulletedItemProps[] = [
+const BULLETED_ITEMS: BulletedItemProps[] = [
     {
         bulletColor: '#6FCF97',
         title: 'Ethics/Doing the right thing',
-        description:
-            'orem ipsum dolor sit amet, consectetur adipiscing elit. Sed ante vitae lacus condimentum auctor nec ut elit.',
+        description: 'orem ipsum dolor sit amet, consectetur adipiscing elit.',
     },
     {
         bulletColor: '#56CCF2',
-        title: 'Clear communication',
-        description:
-            'orem ipsum dolor sit amet, consectetur adipiscing elit. Sed ante vitae lacus condimentum auctor nec ut elit.',
+        title: 'Consistently ship',
+        description: 'orem ipsum dolor sit amet, consectetur adipiscing elit.',
     },
     {
         bulletColor: '#EB5757',
-        title: 'Grow the whole pie',
-        description:
-            'orem ipsum dolor sit amet, consectetur adipiscing elit. Sed ante vitae lacus condimentum auctor nec ut elit.',
-    },
-];
-const ITEMS_COLUMN2: BulletedItemProps[] = [
-    {
-        bulletColor: '#F2994A',
-        title: 'Crypto-Economic Technology',
-        description:
-            'orem ipsum dolor sit amet, consectetur adipiscing elit. Sed ante vitae lacus condimentum auctor nec ut elit.',
-    },
-    {
-        bulletColor: '#E0E0E0',
-        title: 'Transparency',
-        description:
-            'orem ipsum dolor sit amet, consectetur adipiscing elit. Sed ante vitae lacus condimentum auctor nec ut elit.',
-    },
-    {
-        bulletColor: '#F2C94C',
-        title: 'Positive Energy',
-        description:
-            'orem ipsum dolor sit amet, consectetur adipiscing elit. Sed ante vitae lacus condimentum auctor nec ut elit.',
+        title: 'Focus on long term impact',
+        description: 'orem ipsum dolor sit amet, consectetur adipiscing elit.',
     },
 ];
 
 export const Values = () => {
     const isSmallScreen = false;
     return (
-        <div className="clearfix lg-py4 md-py4 sm-pb4 sm-pt2" style={{ backgroundColor: colors.white }}>
+        <div className="clearfix" style={{ backgroundColor: colors.white }}>
             <div className="mx-auto max-width-4 clearfix">
-                <div className="col lg-col-6 md-col-6 col-12 p2">
-                    {_.map(ITEMS_COLUMN1, bulletedItemProps => {
-                        return (
-                            <BulletedItem
-                                bulletColor={bulletedItemProps.bulletColor}
-                                title={bulletedItemProps.title}
-                                description={bulletedItemProps.description}
-                            />
-                        );
-                    })}
+                <div className="h2 lg-py4 md-py4 sm-py3" style={{ paddingLeft: 90, fontFamily: 'Roboto Mono' }}>
+                    Our Values
                 </div>
-                <div className="col lg-col-6 md-col-6 col-12 p2">
-                    {_.map(ITEMS_COLUMN2, bulletedItemProps => {
+                <div className="col col-12 px2">
+                    {_.map(BULLETED_ITEMS, bulletedItemProps => {
                         return (
                             <BulletedItem
                                 bulletColor={bulletedItemProps.bulletColor}