From a2cb815454033e95a17ae1fc36c7c8d1326c3d39 Mon Sep 17 00:00:00 2001 From: Fred Carlsen Date: Fri, 14 Dec 2018 15:21:39 +0100 Subject: Misc feedbackTweak jobs page --- packages/website/ts/@next/components/text.tsx | 5 ++++- packages/website/ts/@next/pages/about/jobs.tsx | 30 ++++++++++++++++++++------ 2 files changed, 28 insertions(+), 7 deletions(-) (limited to 'packages/website') diff --git a/packages/website/ts/@next/components/text.tsx b/packages/website/ts/@next/components/text.tsx index c29277c16..c333dc43a 100644 --- a/packages/website/ts/@next/components/text.tsx +++ b/packages/website/ts/@next/components/text.tsx @@ -5,6 +5,7 @@ import {getCSSPadding, PaddingInterface} from 'ts/@next/constants/utilities'; interface BaseTextInterface extends PaddingInterface { size?: 'default' | 'medium' | 'large' | 'small' | number; isCentered?: boolean; + textAlign?: string; } interface HeadingProps extends BaseTextInterface { @@ -23,6 +24,7 @@ interface ParagraphProps extends BaseTextInterface { isNoMargin?: boolean; marginBottom?: string; // maybe we should remove isNoMargin isMuted?: boolean | number; + fontWeight?: string | number; } const StyledHeading = styled.h1` @@ -67,11 +69,12 @@ export const Heading: React.StatelessComponent = props => { // for literally anything = export const Paragraph = styled.p` font-size: ${props => `var(--${props.size || 'default'}Paragraph)`}; + font-weight: ${props => props.fontWeight || 300}; margin-bottom: ${props => !props.isNoMargin && (props.marginBottom || '30px')}; padding: ${props => props.padding && getCSSPadding(props.padding)}; color: ${props => props.color || props.theme.paragraphColor}; opacity: ${props => typeof props.isMuted === 'boolean' ? 0.75 : props.isMuted}; - text-align: ${props => props.isCentered && 'center'}; + text-align: ${props => props.textAlign ? props.textAlign : props.isCentered && 'center'}; line-height: 1.4; `; diff --git a/packages/website/ts/@next/pages/about/jobs.tsx b/packages/website/ts/@next/pages/about/jobs.tsx index 3f4fa9f14..3ed05083e 100644 --- a/packages/website/ts/@next/pages/about/jobs.tsx +++ b/packages/website/ts/@next/pages/about/jobs.tsx @@ -99,23 +99,25 @@ export const NextAboutJobs = () => ( ); const Position = ({ position }) => ( - + - {position.title} + {position.title} - - {position.location} + + {position.location} - Apply + Apply - + ); const BenefitsList = styled.ul` color: #000; + font-weight: 300; + line-height: 1.444444444; list-style: disc; columns: auto 2; column-gap: 80px; @@ -137,3 +139,19 @@ const ImageWrap = styled.figure` const StyledColumn = styled(Column)` flex-shrink: 0; `; + +const PositionWrap = styled(FlexWrap)` + margin-bottom: 40px; + padding-bottom: 30px; + position: relative; + + &:after { + content: ''; + width: 100%; + position: absolute; + bottom: 0; + left: 0; + height: 1px; + background-color: #E3E3E3; + } +`; -- cgit v1.2.3