diff --git a/website/gatsby-browser.js b/website/gatsby-browser.js
new file mode 100644
index 000000000..e942f19b3
--- /dev/null
+++ b/website/gatsby-browser.js
@@ -0,0 +1 @@
+import "./src/styles/global-styles.css"
diff --git a/website/src/images/placeholder-mobile.svg b/website/src/images/placeholder-mobile.svg
new file mode 100644
index 000000000..b9189ab6c
--- /dev/null
+++ b/website/src/images/placeholder-mobile.svg
@@ -0,0 +1,43 @@
+
diff --git a/website/src/images/placeholder.svg b/website/src/images/placeholder.svg
new file mode 100644
index 000000000..04bae5360
--- /dev/null
+++ b/website/src/images/placeholder.svg
@@ -0,0 +1,70 @@
+
diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx
index 0003e8d76..d8fa2abd0 100644
--- a/website/src/pages/index.tsx
+++ b/website/src/pages/index.tsx
@@ -3,7 +3,9 @@ import * as React from "react"
function IndexPage() {
return (
- Landing page
+
)
}
diff --git a/website/src/styles/global-styles.css b/website/src/styles/global-styles.css
new file mode 100644
index 000000000..bdd150f7e
--- /dev/null
+++ b/website/src/styles/global-styles.css
@@ -0,0 +1,33 @@
+body {
+ width: 100vw;
+ height: 100vh;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
+}
+
+.placeholder {
+ width: 100vw;
+ height: 100vh;
+ padding: 10px;
+ box-sizing: border-box;
+ background-color: #F3E5C1;
+}
+
+.placeholder_svg {
+ width: 100%;
+ height: 100%;
+ background: url('../images/placeholder.svg');
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: cover;
+}
+
+@media (max-width: 854px) {
+ .placeholder_svg {
+ background: url('../images/placeholder-mobile.svg');
+ background-repeat: no-repeat;
+ background-position: center;
+ background-size: cover;
+ }
+}