Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also .

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also .
Choose a Base Repository
Choose a base branch
Nothing to show
Choose a Head Repository
Choose a head branch
Nothing to show
  • 4 commits
  • 45 files changed
  • 0 commit comments
  • 1 contributor
Showing with 1,052 additions and 10,988 deletions.
  1. +1 −2 .storybook/preview-head.html
  2. +0 −8 firebase.json
  3. +2 −2 next.config.js
  4. +418 −417 package-lock.json
  5. +4 −7 package.json
  6. +24 −35 pages/_document.js
  7. +4 −0 pages/imprint.js
  8. +1 −1 pages/index.js
  9. +0 −31 src/components/atoms/BenefitItem.js
  10. +0 −6 src/components/atoms/HeadAndClaim.js
  11. +35 −2 src/components/atoms/Logo.js
  12. +0 −2 src/components/atoms/index.js
  13. +0 −9 src/components/molecules/Benefits.js
  14. +0 −10 src/components/molecules/ImageGroup.js
  15. +32 −25 src/components/molecules/VendorLogos.js
  16. +52 −1 src/components/molecules/ViewSection.js
  17. +0 −2 src/components/molecules/index.js
  18. +2 −2 src/components/organisms/Package.js
  19. +28 −23 src/components/pages/Homepage.js
  20. +417 −0 src/components/pages/Imprint.js
  21. +1 −0 src/components/pages/index.js
  22. +4 −4 src/stories/atoms/Typography.js
  23. +3 −12 src/stories/atoms/index.js
  24. +2 −21 src/stories/molecules/index.js
  25. +4 −2 src/stories/pages/index.js
  26. +6 −3 src/themes/fonts.js
  27. +3 −3 src/themes/index.js
  28. +9 −0 src/themes/layout.js
  29. +0 −20 static/ai.svg
  30. +0 −10 static/alexa-white.svg
  31. +0 −150 static/avatar4.svg
  32. +0 −21 static/device1.svg
  33. +0 −23 static/device2.svg
  34. BIN static/favicon.png
  35. +0 −10 static/google-white.svg
  36. +0 −32 static/integration.svg
  37. +0 −1 static/logo-blue.svg
  38. +0 −39 static/logo-coloured.svg
  39. +0 −28 static/logo-white.svg
  40. +0 −1 static/logo.svg
  41. +0 −10 static/messenger-white.svg
  42. +0 −696 static/panorama.svg
  43. +0 −301 static/section-cutaway.svg
  44. +0 −480 static/section-outline.svg
  45. +0 −8,536 yarn.lock
@@ -1,3 +1,2 @@
<script async="" src="https://cdn.ampproject.org/v0.js"></script>
-<script async="" custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
-<script async="" custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script>
+<link href="https://fonts.googleapis.com/css?family=Nunito|Merriweather+Sans:400,800" rel="stylesheet">
View
@@ -1,8 +0,0 @@
-{
- "hosting": {
- "public": "out",
- "ignore": [
- "_next"
- ]
- }
-}
View
@@ -1,7 +1,7 @@
module.exports = {
- distDir: 'build',
+ distDir: "build",
exportPathMap: () => ({
- '/': { page: '/' }
+ "/": { page: "/" }
}),
onDemandEntries: {
maxInactiveAge: 100,
View

Large diffs are not rendered by default.

Oops, something went wrong.
View
@@ -8,6 +8,7 @@
"scripts": {
"dev": "start-storybook -s ./ -p 9001 -c .storybook",
"build": "next build",
+ "start": "next start",
"lint": "eslint -c ./package.json ./src"
},
"keywords": [],
@@ -20,6 +21,7 @@
"@storybook/react": "^3.3.15",
"babel-core": "^6.26.0",
"babel-eslint": "^8.2.1",
+ "babel-plugin-module-resolver": "^3.1.0",
"babel-plugin-root-import": "^5.1.0",
"babel-plugin-styled-components": "^1.4.0",
"babel-preset-env": "^1.6.1",
@@ -61,7 +63,8 @@
},
"jsx-a11y/accessible-emoji": "off",
"function-paren-newline": "off",
- "import/prefer-default-export": "off"
+ "import/prefer-default-export": "off",
+ "jsx-a11y/anchor-is-valid": "off"
},
"settings": {
"import/resolver": {
@@ -84,12 +87,6 @@
"displayName": true,
"preprocess": false
}
- ],
- [
- "babel-plugin-root-import",
- {
- "rootPathSuffix": "src"
- }
]
]
}
View
@@ -13,17 +13,15 @@ export default class MyDocument extends Document {
const ampScripts = new AmpScripts();
const sheet = new ServerStyleSheet();
- const page = renderPage((
- App => props => (
- sheet.collectStyles((
- <AmpScriptsManager ampScripts={ampScripts}>
- <ThemeProvider theme={theme}>
- <App {...props} />
- </ThemeProvider>
- </AmpScriptsManager>
- ))
+ const page = renderPage(App => props =>
+ sheet.collectStyles(
+ <AmpScriptsManager ampScripts={ampScripts}>
+ <ThemeProvider theme={theme}>
+ <App {...props} />
+ </ThemeProvider>
+ </AmpScriptsManager>
)
- ));
+ );
const ampScriptTags = ampScripts.getScriptElements();
@@ -34,29 +32,24 @@ export default class MyDocument extends Document {
<style
amp-custom=""
dangerouslySetInnerHTML={{
- __html: sheet.getStyleElement().reduce(
- (
- css,
- {
- props: {
- dangerouslySetInnerHTML: {
- __html = "",
- } = {},
- } = {},
- } = {},
- ) => (
- `${css}${__html}`
- ),
- "",
- ),
+ __html: sheet
+ .getStyleElement()
+ .reduce(
+ (
+ css,
+ {
+ props: { dangerouslySetInnerHTML: { __html = "" } = {} } = {}
+ } = {}
+ ) => `${css}${__html}`,
+ ""
+ )
}}
/>
);
/* eslint-enable */
// Get the dynamic `<title />` from the head generated by next.js
- const title = (
- page.head.filter(({ type }) => type === "title")[0] ||
+ const title = page.head.filter(({ type }) => type === "title")[0] || (
<title>ampreact</title>
);
@@ -65,18 +58,12 @@ export default class MyDocument extends Document {
title,
url: req.url,
ampScriptTags,
- ampStyleTag,
+ ampStyleTag
};
}
render() {
- const {
- title,
- url,
- ampScriptTags,
- ampStyleTag,
- html,
- } = this.props;
+ const { title, url, ampScriptTags, ampStyleTag, html } = this.props;
/* eslint-disable react/no-danger */
return (
@@ -86,6 +73,8 @@ export default class MyDocument extends Document {
{headerBoilerplate(url)}
{ampScriptTags}
{ampStyleTag}
+ <link href="https://fonts.googleapis.com/css?family=Nunito|Merriweather+Sans:400,800" rel="stylesheet" />
+ <link rel="icon" type="image/png" href="static/favicon.png" />
</head>
<body dangerouslySetInnerHTML={{ __html: html }} />
</html>
View
@@ -0,0 +1,4 @@
+import React from "react";
+import { Imprint } from "../src/components/pages";
+
+export default () => <Imprint />;
View
@@ -1,4 +1,4 @@
import React from "react";
-import { Homepage } from "components/pages";
+import { Homepage } from "../src/components/pages";
export default () => <Homepage />;
@@ -1,31 +0,0 @@
-import PropTypes from "prop-types";
-import styled from "styled-components";
-
-const BenefitItem = styled.li`
- display: flex;
- flex: 1;
- list-style: none;
- padding-left: 1.8em;
- position: relative;
- margin-right: 1.8em;
-
- &:before {
- content: "${props => props.icon}";
- position: absolute;
- left: 0;
- }
-
- &:last-child {
- margin-right: 0;
- }
-`;
-
-BenefitItem.propTypes = {
- icon: PropTypes.string
-};
-
-BenefitItem.defaultProps = {
- icon: "❤️"
-};
-
-export default BenefitItem;
@@ -1,6 +0,0 @@
-import styled from "styled-components";
-
-export default styled.div`
- text-align: center;
- max-width: 80%;
-`;
@@ -1,13 +1,46 @@
import React from "react";
+import PropTypes from "prop-types";
import styled from "styled-components";
+import Link from "next/link";
const LogoWrapper = styled.div`
height: 3rem;
color: ${props => props.theme.colors.white};
align-self: flex-start;
flex: 1;
+
+ a {
+ color: inherit;
+ text-decoration: none;
+ }
+
+ ${props =>
+ props.dark &&
+ `
+ color: ${props.theme.colors.almostblack};
+ `};
`;
-export default function Logo() {
- return <LogoWrapper>Voice.link</LogoWrapper>;
+function Logo({ href, ...props }) {
+ return (
+ <LogoWrapper {...props}>
+ {href ? (
+ <Link href={href}>
+ <a>Voice.link</a>
+ </Link>
+ ) : (
+ "Voice.link"
+ )}
+ </LogoWrapper>
+ );
}
+
+Logo.propTypes = {
+ href: PropTypes.string
+};
+
+Logo.defaultProps = {
+ href: undefined
+};
+
+export default Logo;
@@ -1,11 +1,9 @@
export { default as Logo } from "./Logo";
export { default as CallToAction } from "./CallToAction";
-export { default as HeadAndClaim } from "./HeadAndClaim";
export { default as Headline } from "./Headline";
export { default as SectionHeadline } from "./SectionHeadline";
export { default as Caption } from "./Caption";
export { default as Avatar } from "./Avatar";
export { default as TextSegment } from "./TextSegment";
-export { default as BenefitItem } from "./BenefitItem";
export { default as MouseScroll } from "./MouseScroll";
export { default as PackageActions } from "./PackageActions";
@@ -1,9 +0,0 @@
-import styled from "styled-components";
-
-export default styled.ul`
- display: flex;
- flex-flow: row;
- text-align: left;
- max-width: 80%;
- padding: 0;
-`;
@@ -1,10 +0,0 @@
-import styled from "styled-components";
-
-export default styled.div`
- display: flex;
- flex-flow: row;
- ${({ count, size }) => `
- width: calc((${count} * ${size}px) + (${count - 1} * 2em));
- `} justify-content: space-evenly;
- margin: 1em;
-`;
@@ -1,36 +1,43 @@
import React from "react";
import PropTypes from "prop-types";
import { Amp } from "react-amphtml";
-
-import ImageGroup from "./ImageGroup";
+import { Grid, Col, Row } from "react-styled-flexboxgrid";
export default function VendorLogos({ size, light }) {
const variant = light ? "-white" : "";
return (
- <ImageGroup size={size} count={3}>
- <Amp.Img
- src={`static/alexa${variant}.svg`}
- alt="Amazon Alexa"
- height={size}
- width={size}
- layout="fixed"
- />
- <Amp.Img
- src={`static/google${variant}.svg`}
- alt="Google Home"
- height={size}
- width={size}
- layout="fixed"
- />
- <Amp.Img
- src={`static/messenger${variant}.svg`}
- alt="Messenger Platform"
- height={size}
- width={size}
- layout="fixed"
- />
- </ImageGroup>
+ <Grid>
+ <Row>
+ <Col smOffset={3} sm={2}>
+ <Amp.Img
+ src={`static/alexa${variant}.svg`}
+ alt="Amazon Alexa"
+ height={size}
+ width={size}
+ layout="fixed"
+ />
+ </Col>
+ <Col sm={2}>
+ <Amp.Img
+ src={`static/google${variant}.svg`}
+ alt="Google Home"
+ height={size}
+ width={size}
+ layout="fixed"
+ />
+ </Col>
+ <Col sm={2}>
+ <Amp.Img
+ src={`static/messenger${variant}.svg`}
+ alt="Messenger Platform"
+ height={size}
+ width={size}
+ layout="fixed"
+ />
+ </Col>
+ </Row>
+ </Grid>
);
}
Oops, something went wrong.

No commit comments for this range