From 3ee3576f6937cad146031b55e38a16f943c79a62 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Sat, 4 May 2019 16:55:27 -0400
Subject: [PATCH] fix wacky layout on mobile - closes #2673

---
 site/package-lock.json                   |   6 +-
 site/package.json                        |   2 +-
 site/src/routes/_components/Blurb.svelte | 165 -----------------------
 site/src/routes/index.svelte             |   1 -
 4 files changed, 4 insertions(+), 170 deletions(-)
 delete mode 100644 site/src/routes/_components/Blurb.svelte

diff --git a/site/package-lock.json b/site/package-lock.json
index 4c3fd1d8ca..a153716298 100644
--- a/site/package-lock.json
+++ b/site/package-lock.json
@@ -1381,9 +1381,9 @@
       }
     },
     "@sveltejs/site-kit": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/@sveltejs/site-kit/-/site-kit-1.0.3.tgz",
-      "integrity": "sha512-JFwFnzTGyCFI/j2qHiHaD3cvth2jurIgF72MwHayfmzJedcIEwEhj5qlKrDOjMc7Z95UV5Uuo20d2iVaF94slQ==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@sveltejs/site-kit/-/site-kit-1.0.4.tgz",
+      "integrity": "sha512-BaQhIL1iPhCF+iDXfy9psDvRdFzfyMPkWnoZHfVz+INpHsU2aJmRZOPl9rykXmPyiPo+AwTTNK5vjIvmtwHLPQ==",
       "dev": true,
       "requires": {
         "@sindresorhus/slugify": "^0.9.1",
diff --git a/site/package.json b/site/package.json
index 3b92c7efc8..5a93669e0d 100644
--- a/site/package.json
+++ b/site/package.json
@@ -37,7 +37,7 @@
     "@babel/preset-env": "^7.4.4",
     "@babel/runtime": "^7.4.4",
     "@sindresorhus/slugify": "^0.9.1",
-    "@sveltejs/site-kit": "^1.0.3",
+    "@sveltejs/site-kit": "^1.0.4",
     "@sveltejs/svelte-repl": "0.0.10",
     "chokidar": "^3.0.0",
     "degit": "^2.1.3",
diff --git a/site/src/routes/_components/Blurb.svelte b/site/src/routes/_components/Blurb.svelte
deleted file mode 100644
index f6feb6dd5a..0000000000
--- a/site/src/routes/_components/Blurb.svelte
+++ /dev/null
@@ -1,165 +0,0 @@
-<style>
-	.container {
-		position: relative;
-		display: grid;
-		margin: 10rem auto;
-		padding: 0 var(--side-nav);
-		max-width: 120rem;
-		grid-row-gap: 1em;
-		grid-template-areas:
-			"one"
-			"two"
-			"three"
-			"what"
-			"start";
-	}
-
-	.box {
-		padding: 1em;
-		display: flex;
-		flex-direction: column;
-		border-bottom: none;
-	}
-
-	h2 {
-		padding: 0;
-		margin: 0 0 0.5em 0;
-		font-size: var(--h2);
-		color: white;
-		text-align: left;
-	}
-
-	p {
-		font-size: var(--h5);
-	}
-
-	.learn-more {
-		position: relative;
-		text-align: right;
-		margin-top: auto;
-		padding: 0 1.2em 0 0;
-	}
-
-	.box:hover .learn-more {
-		color: white;
-		text-decoration: underline;
-	}
-
-	.learn-more::after, .cta a::after {
-		content: '';
-		position: absolute;
-		display: block;
-		right: 0;
-		top: 0.35em;
-		width: 1em;
-		height: 1em;
-		background: url(/icons/arrow-right.svg);
-	}
-
-	.cta a {
-		display: inline-block;
-		text-align: right;
-		background-color: var(--prime);
-		padding: 0.5em 1.8em 0.5em 1em;
-		border-radius: var(--border-r);
-		color: white;
-		position: relative;
-	}
-
-	.cta a::after {
-		right: 0.5em;
-		top: 0.75em;
-	}
-
-	.description {
-		margin: 2em 0 0 0;
-	}
-
-	.cta {
-		margin: 0;
-	}
-
-	@media (min-width: 900px) {
-		.container {
-			grid-column-gap: 1em;
-			grid-row-gap: 1em;
-			grid-template-columns: repeat(2, 1fr);
-			grid-template-areas:
-				"one two"
-				"three start"
-				"what what";
-		}
-
-		.box {
-			padding: 2em;
-		}
-
-		.cta {
-			text-align: right;
-		}
-	}
-
-	@media (min-width: 1200px) {
-		.container {
-			grid-column-gap: 1em;
-			grid-row-gap: 5em;
-			grid-template-columns: repeat(6, 1fr);
-			grid-template-areas:
-				"one one two two three three"
-				"what what what start start start";
-		}
-
-		.description {
-			margin: 0;
-		}
-
-		.cta {
-			text-align: left;
-		}
-	}
-</style>
-
-<section class='container'>
-	<a href="blog/write-less-code" class='box bg-prime white' style="grid-area: one">
-		<h2>Write less code</h2>
-		<p>Build boilerplate-free components using languages you already know — HTML, CSS and JavaScript</p>
-
-		<span class="learn-more">learn more</span>
-	</a>
-
-	<a href="blog/virtual-dom-is-pure-overhead" class='box bg-flash white' style="grid-area: two">
-		<h2>No virtual DOM</h2>
-		<p>Svelte compiles your code to tiny, framework-less vanilla JS — your app starts fast and stays fast</p>
-
-		<span class="learn-more">learn more</span>
-	</a>
-
-	<a href="blog/svelte-3-rethinking-reactivity" class='box bg-second white' style="grid-area: three">
-		<h2>Truly reactive</h2>
-		<p>No more complex state management libraries — Svelte brings reactivity to JavaScript itself</p>
-
-		<span class="learn-more">learn more</span>
-	</a>
-
-	<div class="description" style="grid-area: what;">
-		<p>Svelte is a radical new approach to building user interfaces. Whereas traditional frameworks like React and Vue do the bulk of their work in the <em>browser</em>, Svelte shifts that work into a <em>compile step</em> that happens when you build your app.</p>
-
-		<p>Instead of using techniques like virtual DOM diffing, Svelte writes code that surgically updates the DOM when the state of your app changes.</p>
-
-		<p><a href="blog/svelte-3-rethinking-reactivity">Read the introductory blog post</a> to learn more.</p>
-	</div>
-
-	<div style="grid-area: start; display: flex; flex-direction: column; min-width: 0">
-		<pre class="language-bash" style="margin: 0 0 1em 0; min-width: 0; min-height: 0">
-npx degit sveltejs/template my-svelte-project
-cd my-svelte-project
-
-npm install
-npm run dev & open http://localhost:5000
-		</pre>
-
-		<p style="flex: 1">See the <a href="blog/the-easiest-way-to-get-started">quickstart guide</a> for more information.</p>
-
-		<p class="cta"><a rel="prefetch" href="tutorial">Learn Svelte</a></p>
-	</div>
-</section>
\ No newline at end of file
diff --git a/site/src/routes/index.svelte b/site/src/routes/index.svelte
index 46f86050d4..b076fe3a0d 100644
--- a/site/src/routes/index.svelte
+++ b/site/src/routes/index.svelte
@@ -1,6 +1,5 @@
 <script>
 	import { Blurb, Hero, Section } from '@sveltejs/site-kit';
-	// import Blurb from './_components/Blurb.svelte';
 	import Example from './_components/Example.svelte';
 	import WhosUsingSvelte from './_components/WhosUsingSvelte.svelte';
 	// import Lazy from '../components/Lazy.svelte';