aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/pages/about
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/pages/about')
-rw-r--r--packages/website/ts/pages/about/about.tsx97
-rw-r--r--packages/website/ts/pages/about/profile.tsx54
2 files changed, 58 insertions, 93 deletions
diff --git a/packages/website/ts/pages/about/about.tsx b/packages/website/ts/pages/about/about.tsx
index 722e819ff..3ff16f9fe 100644
--- a/packages/website/ts/pages/about/about.tsx
+++ b/packages/website/ts/pages/about/about.tsx
@@ -1,13 +1,13 @@
import * as _ from 'lodash';
import * as React from 'react';
import * as DocumentTitle from 'react-document-title';
-import {Footer} from 'ts/components/footer';
-import {TopBar} from 'ts/components/top_bar';
-import {Profile} from 'ts/pages/about/profile';
-import {ProfileInfo, Styles} from 'ts/types';
-import {colors} from 'ts/utils/colors';
-import {constants} from 'ts/utils/constants';
-import {utils} from 'ts/utils/utils';
+import { Footer } from 'ts/components/footer';
+import { TopBar } from 'ts/components/top_bar';
+import { Profile } from 'ts/pages/about/profile';
+import { ProfileInfo, Styles } from 'ts/types';
+import { colors } from 'ts/utils/colors';
+import { constants } from 'ts/utils/constants';
+import { utils } from 'ts/utils/utils';
const teamRow1: ProfileInfo[] = [
{
@@ -155,73 +155,61 @@ export class About extends React.Component<AboutProps, AboutState> {
}
public render() {
return (
- <div style={{backgroundColor: colors.lightestGrey}}>
- <DocumentTitle title="0x About Us"/>
+ <div style={{ backgroundColor: colors.lightestGrey }}>
+ <DocumentTitle title="0x About Us" />
<TopBar
blockchainIsLoaded={false}
location={this.props.location}
- style={{backgroundColor: colors.lightestGrey}}
+ style={{ backgroundColor: colors.lightestGrey }}
/>
- <div
- id="about"
- className="mx-auto max-width-4 py4"
- style={{color: colors.grey800}}
- >
- <div
- className="mx-auto pb4 sm-px3"
- style={{maxWidth: 435}}
- >
- <div
- style={styles.header}
- >
- About us:
- </div>
+ <div id="about" className="mx-auto max-width-4 py4" style={{ color: colors.grey800 }}>
+ <div className="mx-auto pb4 sm-px3" style={{ maxWidth: 435 }}>
+ <div style={styles.header}>About us:</div>
<div
className="pt3"
- style={{fontSize: 17, color: colors.darkestGrey, lineHeight: 1.5}}
+ style={{
+ fontSize: 17,
+ color: colors.darkestGrey,
+ lineHeight: 1.5,
+ }}
>
- Our team is a diverse and globally distributed group with backgrounds
- in engineering, research, business and design. We are passionate about
- decentralized technology and its potential to act as an equalizing force
- in the world.
+ Our team is a diverse and globally distributed group with backgrounds in engineering,
+ research, business and design. We are passionate about decentralized technology and its
+ potential to act as an equalizing force in the world.
</div>
</div>
<div className="pt3 md-px4 lg-px0">
- <div className="clearfix pb3">
- {this._renderProfiles(teamRow1)}
- </div>
- <div className="clearfix">
- {this._renderProfiles(teamRow2)}
- </div>
+ <div className="clearfix pb3">{this._renderProfiles(teamRow1)}</div>
+ <div className="clearfix">{this._renderProfiles(teamRow2)}</div>
</div>
<div className="pt3 pb2">
<div
className="pt2 pb3 sm-center md-pl4 lg-pl0 md-ml3"
- style={{color: colors.grey, fontSize: 24, fontFamily: 'Roboto Mono'}}
+ style={{
+ color: colors.grey,
+ fontSize: 24,
+ fontFamily: 'Roboto Mono',
+ }}
>
Advisors:
</div>
- <div className="clearfix">
- {this._renderProfiles(advisors)}
- </div>
+ <div className="clearfix">{this._renderProfiles(advisors)}</div>
</div>
- <div className="mx-auto py4 sm-px3" style={{maxWidth: 308}}>
- <div
- className="pb2"
- style={styles.weAreHiring}
- >
+ <div className="mx-auto py4 sm-px3" style={{ maxWidth: 308 }}>
+ <div className="pb2" style={styles.weAreHiring}>
WE'RE HIRING
</div>
<div
className="pb4 mb4"
- style={{fontSize: 16, color: colors.darkestGrey, lineHeight: 1.5, letterSpacing: '0.5px'}}
+ style={{
+ fontSize: 16,
+ color: colors.darkestGrey,
+ lineHeight: 1.5,
+ letterSpacing: '0.5px',
+ }}
>
We are seeking outstanding candidates to{' '}
- <a
- href={constants.URL_ANGELLIST}
- target="_blank"
- style={{color: 'black'}}
- >
+ <a href={constants.URL_ANGELLIST} target="_blank" style={{ color: 'black' }}>
join our team
</a>
. We value passion, diversity and unique perspectives.
@@ -237,13 +225,8 @@ export class About extends React.Component<AboutProps, AboutState> {
const colSize = utils.getColSize(numIndiv);
return _.map(profiles, profile => {
return (
- <div
- key={`profile-${profile.name}`}
- >
- <Profile
- colSize={colSize}
- profileInfo={profile}
- />
+ <div key={`profile-${profile.name}`}>
+ <Profile colSize={colSize} profileInfo={profile} />
</div>
);
});
diff --git a/packages/website/ts/pages/about/profile.tsx b/packages/website/ts/pages/about/profile.tsx
index ef74f268a..bd2316f31 100644
--- a/packages/website/ts/pages/about/profile.tsx
+++ b/packages/website/ts/pages/about/profile.tsx
@@ -1,7 +1,7 @@
import * as _ from 'lodash';
import * as React from 'react';
-import {ProfileInfo, Styles} from 'ts/types';
-import {colors} from 'ts/utils/colors';
+import { ProfileInfo, Styles } from 'ts/types';
+import { colors } from 'ts/utils/colors';
const IMAGE_DIMENSION = 149;
const styles: Styles = {
@@ -24,43 +24,30 @@ interface ProfileProps {
export function Profile(props: ProfileProps) {
return (
- <div
- className={`lg-col md-col lg-col-${props.colSize} md-col-6`}
- >
- <div
- style={{maxWidth: 300}}
- className="mx-auto lg-px3 md-px3 sm-px4 sm-pb3"
- >
- <div
- className="circle overflow-hidden mx-auto"
- style={styles.imageContainer}
- >
- <img
- width={IMAGE_DIMENSION}
- src={props.profileInfo.image}
- />
+ <div className={`lg-col md-col lg-col-${props.colSize} md-col-6`}>
+ <div style={{ maxWidth: 300 }} className="mx-auto lg-px3 md-px3 sm-px4 sm-pb3">
+ <div className="circle overflow-hidden mx-auto" style={styles.imageContainer}>
+ <img width={IMAGE_DIMENSION} src={props.profileInfo.image} />
</div>
- <div
- className="center"
- style={{fontSize: 18, fontWeight: 'bold', paddingTop: 20}}
- >
+ <div className="center" style={{ fontSize: 18, fontWeight: 'bold', paddingTop: 20 }}>
{props.profileInfo.name}
</div>
- {!_.isUndefined(props.profileInfo.title) &&
+ {!_.isUndefined(props.profileInfo.title) && (
<div
className="pt1 center"
- style={{fontSize: 14, fontFamily: 'Roboto Mono', color: colors.darkGrey}}
+ style={{
+ fontSize: 14,
+ fontFamily: 'Roboto Mono',
+ color: colors.darkGrey,
+ }}
>
{props.profileInfo.title.toUpperCase()}
</div>
- }
- <div
- style={{minHeight: 60, lineHeight: 1.4}}
- className="pt1 pb2 mx-auto lg-h6 md-h6 sm-h5 sm-center"
- >
+ )}
+ <div style={{ minHeight: 60, lineHeight: 1.4 }} className="pt1 pb2 mx-auto lg-h6 md-h6 sm-h5 sm-center">
{props.profileInfo.description}
</div>
- <div className="flex pb3 mx-auto sm-hide xs-hide" style={{width: 180, opacity: 0.5}}>
+ <div className="flex pb3 mx-auto sm-hide xs-hide" style={{ width: 180, opacity: 0.5 }}>
{renderSocialMediaIcons(props.profileInfo)}
</div>
</div>
@@ -84,13 +71,8 @@ function renderSocialMediaIcon(iconName: string, url: string) {
return (
<div key={url} className="pr1">
- <a
- href={url}
- style={{color: 'inherit'}}
- target="_blank"
- className="text-decoration-none"
- >
- <i className={`zmdi ${iconName}`} style={{...styles.socalIcon}} />
+ <a href={url} style={{ color: 'inherit' }} target="_blank" className="text-decoration-none">
+ <i className={`zmdi ${iconName}`} style={{ ...styles.socalIcon }} />
</a>
</div>
);