aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorBrandon Millman <brandon.millman@gmail.com>2018-07-25 14:21:39 +0800
committerBrandon Millman <brandon.millman@gmail.com>2018-07-25 14:21:39 +0800
commitb0fab3ea4a7238fca6538a85e251540cc4001040 (patch)
tree2eea919cd308948bbbeeac7ee6e25547a020fbed
parent51fb6e6a23b38dffdbdaf7b7ac1b45b6783b7fa9 (diff)
downloaddexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.tar
dexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.tar.gz
dexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.tar.bz2
dexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.tar.lz
dexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.tar.xz
dexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.tar.zst
dexon-sol-tools-b0fab3ea4a7238fca6538a85e251540cc4001040.zip
Use our image component in mission
-rw-r--r--packages/website/ts/components/ui/image.tsx6
-rw-r--r--packages/website/ts/pages/jobs/mission.tsx3
2 files changed, 7 insertions, 2 deletions
diff --git a/packages/website/ts/components/ui/image.tsx b/packages/website/ts/components/ui/image.tsx
index c4ff93531..c8d39352b 100644
--- a/packages/website/ts/components/ui/image.tsx
+++ b/packages/website/ts/components/ui/image.tsx
@@ -5,9 +5,11 @@ export interface ImageProps {
className?: string;
src?: string;
fallbackSrc?: string;
- height?: string | number;
borderRadius?: string;
width?: string | number;
+ height?: string | number;
+ maxWidth?: string | number;
+ maxHeight?: string | number;
}
interface ImageState {
imageLoadFailed: boolean;
@@ -29,6 +31,8 @@ export class Image extends React.Component<ImageProps, ImageState> {
src={src}
style={{
borderRadius: this.props.borderRadius,
+ maxWidth: this.props.maxWidth,
+ maxHeight: this.props.maxHeight,
}}
height={this.props.height}
width={this.props.width}
diff --git a/packages/website/ts/pages/jobs/mission.tsx b/packages/website/ts/pages/jobs/mission.tsx
index daec1e62a..b78cdc886 100644
--- a/packages/website/ts/pages/jobs/mission.tsx
+++ b/packages/website/ts/pages/jobs/mission.tsx
@@ -1,6 +1,7 @@
import * as React from 'react';
import { Container } from 'ts/components/ui/container';
+import { Image } from 'ts/components/ui/image';
import { Text } from 'ts/components/ui/text';
import { colors } from 'ts/style/colors';
import { ScreenWidths } from 'ts/types';
@@ -10,7 +11,7 @@ export interface MissionProps {
}
export const Mission = (props: MissionProps) => {
const isSmallScreen = props.screenWidth === ScreenWidths.Sm;
- const image = <img src="/images/jobs/world-map.svg" style={{ maxWidth: 500, maxHeight: 280 }} />;
+ const image = <Image src="/images/jobs/world-map.svg" maxWidth="500px" maxHeight="280px" />;
const missionStatementClassName = isSmallScreen ? 'center' : undefined;
const missionStatement = (
<Container className={missionStatementClassName} maxWidth="388px">