Skip to content

Commit 9caed33

Browse files
author
Luciano Nooijen
committed
WIP on Over ons
1 parent cdf2716 commit 9caed33

File tree

4 files changed

+58
-73
lines changed

4 files changed

+58
-73
lines changed

components/TeamMember.jsx

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React from 'react';
22
import styled from 'styled-components';
33
import theme from '../styles/theme';
44
import AllSocials from '../lib/Socials';
5+
import { Col } from '../lib/Grid';
56

67
const TeamMemberWrapper = styled.div`
78
padding: 3rem 0rem 3rem 0rem;
@@ -79,25 +80,35 @@ const TeamMemberPhoto = styled.figure`
7980
min-height: 5em;
8081
}
8182
`;
83+
8284
const getAltText = (name, alt) => {
8385
if (alt) {
8486
return alt;
8587
}
8688
return `Een foto van ${name}`;
8789
};
90+
8891
const TeamMember = props => {
8992
// eslint-disable-next-line
9093
const { name, title, img, alt } = props;
9194

9295
return (
93-
<TeamMemberWrapper>
94-
<TeamMemberPhoto>
95-
<img src={img} alt={getAltText(name, alt)} />
96-
</TeamMemberPhoto>
97-
<h4>{name}</h4>
98-
<p>{title}</p>
99-
<AllSocials {...props} />
100-
</TeamMemberWrapper>
96+
<Col
97+
offset={({ md: 0 }, { lg: 1 }, { xl: 1 })}
98+
sm={6}
99+
md={4}
100+
lg={3}
101+
xl={2}
102+
>
103+
<TeamMemberWrapper>
104+
<TeamMemberPhoto>
105+
<img src={img} alt={getAltText(name, alt)} />
106+
</TeamMemberPhoto>
107+
<h4>{name}</h4>
108+
<p>{title}</p>
109+
<AllSocials {...props} />
110+
</TeamMemberWrapper>
111+
</Col>
101112
);
102113
};
103114

pages/over.jsx

Lines changed: 39 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import ContactForm from '../components/ContactForm';
99
import Wrapper from '../components/Wrapper';
1010

1111
const pageSettings = {
12-
title: `Over ons - Bytecode Digital Agency |
12+
title: `Over ons - Bytecode Digital Agency |
1313
Wie zijn de drijvende krachten achter Bytecode?`,
1414
description: `Over ons. Wie of wat is Bytecode? Wat is onze missie
1515
en hoe willen wij die bereiken? Kom meer te weten of het Bytecode-team!`,
@@ -41,15 +41,9 @@ const Over = () => (
4141
</ContentPageHeader>
4242
<Container fluid>
4343
<Row>
44-
<Col
45-
offset={({ md: 0 }, { lg: 1 }, { xl: 2 })}
46-
md={6}
47-
lg={5}
48-
xl={3}
49-
>
44+
<Col offset={{ md: 0, lg: 1, xl: 2 }} md={6} lg={5} xl={3}>
5045
<TextBlock
5146
subtitle="Onze Visie"
52-
alt="I'm different!"
5347
title="De titel maar dan een hele erge fucking lange
5448
titel waar geen einde aan lijkt te komen"
5549
headingType="h2"
@@ -66,12 +60,7 @@ const Over = () => (
6660
/>
6761
<Container fluid>
6862
<Row>
69-
<Col
70-
offset={({ md: 0 }, { lg: 0 }, { xl: 1 })}
71-
md={6}
72-
lg={6}
73-
xl={4}
74-
>
63+
<Col offset={{ md: 0, lg: 1, xl: 1 }} md={6} lg={6} xl={4}>
7564
<TextBlock
7665
subtitle="Het team"
7766
alt="Het team"
@@ -83,57 +72,42 @@ const Over = () => (
8372
</Col>
8473
</Row>
8574
<Row>
86-
<Col
87-
offset={({ md: 0 }, { lg: 1 }, { xl: 1 })}
88-
sm={6}
89-
md={4}
90-
lg={3}
91-
xl={2}
92-
>
93-
<TeamMember
94-
name="Jeroen van Steijn"
95-
title="Co-founder & software consultant"
96-
img="/static/img/team/Jeroen.png"
97-
facebook="https://www.facebook.com/jjvansteijn"
98-
twitter="https://twitter.com/jjvansteijn"
99-
instagram="https://www.instagram.com/jjvansteijn"
100-
linkedin="https://www.linkedin.com/in/jjvansteijn"
101-
/>
102-
</Col>
103-
<Col
104-
offset={({ md: 0 }, { lg: 1 }, { xl: 0.25 })}
105-
sm={6}
106-
md={4}
107-
lg={3}
108-
xl={2}
109-
>
110-
<TeamMember
111-
name="Luciano Nooijen"
112-
title="Co-founder & software consultant"
113-
img="/static/img/team/Luciano.png"
114-
facebook="https://www.facebook.com/lucianonooijen"
115-
twitter="https://twitter.com/lucianonooijen"
116-
instagram="https://www.instagram.com/lucianonooijen"
117-
linkedin="https://www.linkedin.com/in/lucianonooijen"
118-
/>
119-
</Col>
120-
<Col
121-
offset={({ md: 0 }, { lg: 1 }, { xl: 0.25 })}
122-
sm={6}
123-
md={4}
124-
lg={3}
125-
xl={2}
126-
>
127-
<TeamMember
128-
name="Richard van 't Hof"
129-
title="Designer &amp; front-end developer"
130-
img="/static/img/team/Richard.png"
131-
facebook="https://www.facebook.com/richardvanthof"
132-
twitter="https://twitter.com/richardvanthof"
133-
instagram="https://www.instagram.com/richardvanthof"
134-
linkedin="https://www.linkedin.com/in/richardvanthof"
135-
/>
136-
</Col>
75+
<TeamMember
76+
name="Jeroen van Steijn"
77+
title="Co-founder & software consultant"
78+
img="/static/img/team/jeroen.png"
79+
facebook="https://www.facebook.com/jjvansteijn"
80+
twitter="https://twitter.com/jjvansteijn"
81+
instagram="https://www.instagram.com/jjvansteijn"
82+
linkedin="https://www.linkedin.com/in/jjvansteijn"
83+
/>
84+
<TeamMember
85+
name="Luciano Nooijen"
86+
title="Co-founder & software consultant"
87+
img="/static/img/team/luciano.png"
88+
facebook="https://www.facebook.com/lucianonooijen"
89+
twitter="https://twitter.com/lucianonooijen"
90+
instagram="https://www.instagram.com/lucianonooijen"
91+
linkedin="https://www.linkedin.com/in/lucianonooijen"
92+
/>
93+
<TeamMember
94+
name="Richard van 't Hof"
95+
title="Designer &amp; front-end developer"
96+
img="/static/img/team/richard.png"
97+
facebook="https://www.facebook.com/richardvanthof"
98+
twitter="https://twitter.com/richardvanthof"
99+
instagram="https://www.instagram.com/richardvanthof"
100+
linkedin="https://www.linkedin.com/in/richardvanthof"
101+
/>
102+
<TeamMember
103+
name="Nick Broekarts"
104+
title="Online Marketeer"
105+
img="/static/img/team/nick.png"
106+
facebook="https://www.facebook.com/richardvanthof"
107+
twitter="https://twitter.com/richardvanthof"
108+
instagram="https://www.instagram.com/richardvanthof"
109+
linkedin="https://www.linkedin.com/in/richardvanthof"
110+
/>
137111
</Row>
138112
</Container>
139113
<Wrapper>

static/img/team/nick.png

133 KB
Loading

0 commit comments

Comments
 (0)