aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components/heroImage.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/components/heroImage.tsx')
-rw-r--r--packages/website/ts/components/heroImage.tsx27
1 files changed, 27 insertions, 0 deletions
diff --git a/packages/website/ts/components/heroImage.tsx b/packages/website/ts/components/heroImage.tsx
new file mode 100644
index 000000000..af7c055ac
--- /dev/null
+++ b/packages/website/ts/components/heroImage.tsx
@@ -0,0 +1,27 @@
+import * as React from 'react';
+import styled from 'styled-components';
+
+interface Props {
+ image: React.ReactNode;
+}
+
+export const LandingAnimation = (props: Props) => <Wrap>{props.image}</Wrap>;
+
+const Wrap = styled.figure`
+ display: inline-block;
+
+ svg {
+ width: 100%;
+ height: auto;
+ }
+
+ @media (min-width: 768px) {
+ width: 100%;
+ max-width: 400px;
+ }
+
+ @media (max-width: 768px) {
+ width: 180px;
+ margin-bottom: 40px;
+ }
+`;