Skip to content

Commit 0974b67

Browse files
author
Luciano Nooijen
committed
Merge branch 'release/v2.8.0'
2 parents 970d11b + bfeb180 commit 0974b67

35 files changed

+1852
-54
lines changed

CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
55
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
66
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
77

8+
## 2.8.0 (2021-08-10)
9+
10+
### Added:
11+
12+
* Marketing landings page for startups
13+
814
## 2.7.1 (2021-06-29)
915

1016
### Fixed:

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "bytecode-website",
33
"private": false,
44
"description": "The Bytecode Digital Agency website, released as free software",
5-
"version": "v2.7.1",
5+
"version": "v2.8.0",
66
"author": "Luciano Nooijen <[email protected]>",
77
"keywords": [
88
"bytecode"

src/components/Button/Button.components.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const buttonStyle = css<{ disabled?: boolean }>`
1010
padding: 0.66em 2em;
1111
border-color: ${theme.colors.tertiary};
1212
border-style: solid;
13-
border-width: 0.15rem;
13+
border-width: 0.1rem;
1414
border-radius: 10rem;
1515
transition: all 0.2s ease;
1616
font-size: ${size};

src/components/ImageBlock/ImageBlock.components.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,12 @@ const ImageBlockFigure = styled.figure`
3030
transition: all 0.3s ease;
3131
}
3232
33+
img {
34+
width: 100%;
35+
height: 100%;
36+
object-fit: cover;
37+
}
38+
3339
@media (min-width: ${theme.breakpointMobileMenu}) {
3440
&:after {
3541
margin: 6rem 0 6rem 6rem;

src/components/Typography/Typography.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export const Small = styled.span`
2424
`;
2525

2626
export const Subtitle = styled.p`
27-
size: 0.85rem;
27+
size: 0.75rem;
2828
height: 1.2em;
2929
font-family: ${fonts.paragraph};
3030
font-weight: ${fontWeights.bold};
Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
import styled, { createGlobalStyle } from 'styled-components';
2+
import React, { useState } from 'react';
3+
import theme from '../../styles/theme';
4+
import Button from '../../../components/Button/Button';
5+
import { ComicSansProps } from './Footer.types';
6+
7+
const { mediaQueryMin } = theme;
8+
const container = theme.containerWidth;
9+
10+
export const FooterCol = styled.div`
11+
width: 100%;
12+
margin: 2.5%;
13+
// Quick fix for small object having a wrong line-height
14+
p {
15+
small {
16+
line-height: 1em;
17+
}
18+
}
19+
@media screen and (${mediaQueryMin.sm}) {
20+
width: 45%;
21+
}
22+
@media screen and (${mediaQueryMin.md}) {
23+
width: 20%;
24+
}
25+
`;
26+
27+
export const FooterLogo = styled.img`
28+
transform: translateX(-1.5rem);
29+
max-width: 40vw;
30+
height: 100%;
31+
padding: 1em;
32+
width: auto;
33+
@media (${mediaQueryMin.md}) {
34+
max-width: unset;
35+
}
36+
@media (${mediaQueryMin.sm}) {
37+
transform: translateX(-3rem);
38+
}
39+
`;
40+
41+
export const FooterLinkContainer = styled.div`
42+
margin: 1rem 0;
43+
font-size: 1.33rem;
44+
line-height: 1.33em;
45+
`;
46+
47+
export const FooterLink = styled.a`
48+
display: block;
49+
text-decoration: none;
50+
cursor: pointer;
51+
color: ${theme.colors.lightgray};
52+
`;
53+
54+
export const FooterHeadingContainer = styled.div`
55+
margin: 2em 0 0.66em 0;
56+
p {
57+
margin-bottom: 0;
58+
}
59+
@media (${mediaQueryMin.sm}) {
60+
height: 4.66rem;
61+
display: flex;
62+
align-items: end;
63+
}
64+
`;
65+
66+
export const FooterButton = styled(Button)`
67+
margin-top: 0;
68+
font-size: 0.9rem !important;
69+
padding: 0.5em 2rem;
70+
`;
71+
72+
export const FooterSpacer = styled.div`
73+
height: 3.4rem;
74+
`;
75+
76+
export const FooterContainer = styled.section`
77+
width: 100%;
78+
display: flex;
79+
flex-direction: column;
80+
flex-wrap: wrap;
81+
padding: 3em ${container.xs} 1em ${container.xs};
82+
@media screen and (${mediaQueryMin.sm}) {
83+
padding: 3em ${container.sm} 3em ${container.sm};
84+
flex-direction: row;
85+
}
86+
@media screen and (${mediaQueryMin.md}) {
87+
padding: 3em ${container.md} 0 ${container.md};
88+
}
89+
@media screen and (${mediaQueryMin.lg}) {
90+
padding: 3em ${container.lg} 0 ${container.lg};
91+
}
92+
@media screen and (${mediaQueryMin.xl}) {
93+
padding: 3em ${container.xl} 0 ${container.xl};
94+
}
95+
background: ${theme.colors.secondary};
96+
`;
97+
98+
export const Copyright = styled(FooterContainer)`
99+
justify-content: center;
100+
flex-direction: column !important;
101+
text-align: center;
102+
103+
* {
104+
}
105+
hr {
106+
margin: 0;
107+
opacity: 0.75;
108+
}
109+
110+
p {
111+
padding-top: 1em;
112+
opacity: 0.8;
113+
}
114+
`;
115+
116+
const ComicSansText = styled.span`
117+
cursor: pointer;
118+
`;
119+
const ComicSansCSS = createGlobalStyle`
120+
html * {
121+
font-family: "Comic Sans MS" !important;
122+
}
123+
`;
124+
125+
export const ComicSans: React.FC<ComicSansProps> = ({ children }) => {
126+
const [showComicSans, setShowComicSans] = useState(false);
127+
const switchComicSans = () => setShowComicSans(!showComicSans);
128+
129+
return (
130+
<>
131+
<ComicSansText onClick={switchComicSans}>{children}</ComicSansText>
132+
{showComicSans && <ComicSansCSS />}
133+
</>
134+
);
135+
};
Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,124 @@
1+
import React from 'react';
2+
import AllSocials from '../../../lib/Socials/Socials';
3+
import { Subtitle } from '../../../components/Typography/Typography';
4+
import {
5+
FooterContainer,
6+
ComicSans,
7+
Copyright,
8+
FooterButton,
9+
FooterCol,
10+
FooterHeadingContainer,
11+
FooterLink,
12+
FooterLinkContainer,
13+
FooterLogo,
14+
FooterSpacer,
15+
} from './Footer.components';
16+
17+
const logo = require('../../../images/img/logo.svg');
18+
19+
const Footer: React.FC<Record<string, never>> = () => (
20+
<footer>
21+
<FooterContainer>
22+
<FooterCol>
23+
<FooterHeadingContainer>
24+
<FooterLogo src={logo} alt="Bytecode" />
25+
</FooterHeadingContainer>
26+
<FooterLinkContainer>
27+
<AllSocials
28+
isFooter
29+
facebook="https://www.facebook.com/bytecodeagency"
30+
twitter="https://twitter.com/bytecodeagency"
31+
instagram="https://www.instagram.com/bytecodeagency"
32+
linkedin="https://linkedin.com/company/bytecodeagency"
33+
/>
34+
<FooterLink href="mailto:[email protected]">
35+
36+
</FooterLink>
37+
<FooterLink href="tel:+31152024222">015-2024222</FooterLink>
38+
<FooterSpacer />
39+
<Subtitle>Legal</Subtitle>
40+
<p>
41+
KvK: 71497560
42+
<br />
43+
BTW: NL858738703B01
44+
<br />
45+
IBAN: NL77 BUNQ 2206 3628 13
46+
</p>
47+
</FooterLinkContainer>
48+
</FooterCol>
49+
<FooterCol>
50+
<FooterHeadingContainer>
51+
<Subtitle>Kom langs</Subtitle>
52+
</FooterHeadingContainer>
53+
<p>
54+
Verl. Spiegelmakersstraat 13
55+
<br />
56+
2645LZ Delfgauw
57+
<br />
58+
Nederland
59+
</p>
60+
<FooterButton
61+
href="https://calendly.com/bytecode"
62+
target="_blank"
63+
rel="noopener"
64+
>
65+
Plan een afspraak
66+
</FooterButton>
67+
</FooterCol>
68+
<FooterCol>
69+
<FooterHeadingContainer>
70+
<Subtitle>Broncode website</Subtitle>
71+
</FooterHeadingContainer>
72+
<p>
73+
Wij dragen graag bij aan open source projecten en vrije
74+
software. Om de daad bij het woord te voegen hebben wij de
75+
broncode van deze website onder AGPL-3.0 licentie
76+
vrijgegeven.
77+
</p>
78+
<FooterButton
79+
href="https://github.com/BytecodeBV/Bytecode-Website"
80+
target="_blank"
81+
rel="noopener"
82+
>
83+
Bekijk broncode
84+
</FooterButton>
85+
</FooterCol>
86+
<FooterCol>
87+
<FooterHeadingContainer>
88+
<Subtitle>Documenten</Subtitle>
89+
</FooterHeadingContainer>
90+
<p>
91+
<FooterLink
92+
href="https://cdn.bytecode.nl/algemene-voorwaarden.pdf"
93+
target="_blank"
94+
>
95+
Algemene Voorwaarden
96+
</FooterLink>
97+
<FooterLink href="/legal/privacy-policy">
98+
Privacy Policy
99+
</FooterLink>
100+
<FooterLink href="/legal/cookie-policy">
101+
Cookie Policy
102+
</FooterLink>
103+
</p>
104+
</FooterCol>
105+
</FooterContainer>
106+
<Copyright>
107+
<hr />
108+
<p>
109+
<small>
110+
<ComicSans>&copy;</ComicSans> {new Date().getFullYear()}
111+
&nbsp;Bytecode Digital Agency B.V.
112+
<br />
113+
All Rights Reserved on text and image content,
114+
<a href="https://github.com/BytecodeBV/Bytecode-Website">
115+
&nbsp;source code&nbsp;
116+
</a>
117+
is available under the AGPL-3.0 license.
118+
</small>
119+
</p>
120+
</Copyright>
121+
</footer>
122+
);
123+
124+
export default Footer;
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import React from 'react';
2+
3+
export interface ComicSansProps {
4+
children: React.ReactNode;
5+
}
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import styled from 'styled-components';
2+
import Helmet from 'react-helmet';
3+
import React from 'react';
4+
5+
export const Main = styled.main<{ padded?: boolean }>`
6+
max-width: 100vw !important;
7+
overflow-x: hidden !important;
8+
padding-top: ${(props) => (props.padded ? '15vh' : 0)};
9+
`;
10+
11+
export const HeadElements: React.FC<Record<string, never>> = () => (
12+
<Helmet>
13+
<meta name="robots" content="index, follow" />
14+
<link type="text/plain" rel="author" href="/humans.txt" />
15+
<link
16+
href="https://fonts.googleapis.com/css?family=Cousine|Lato:300,400,700&display=swap"
17+
rel="stylesheet"
18+
/>
19+
</Helmet>
20+
);

0 commit comments

Comments
 (0)