site: update to reflect SvelteKit 1.0 launch (#1828)

* site: update to reflect SvelteKit 1.0 launch

* Update site/src/routes/index.svelte

Co-authored-by: Rich Harris <[email protected]>

Author: benmccann

site/content/docs/00-introduction.md

@@ -4,9 +4,9 @@ title: Introduction
 
 ### Before we begin
 
-> Sapper's successor, [SvelteKit](https://kit.svelte.dev), is currently available for use. All development efforts moving forward will be focused on [SvelteKit](https://kit.svelte.dev).
+> Sapper has been deprecated in favor of [SvelteKit](https://kit.svelte.dev). We recommend using [SvelteKit](https://kit.svelte.dev) for all projects moving forward. Sapper will no be receiving security fixes, bug fixes, or any type of improvements.
 >
-> If you get stuck, reach out for help in the [Discord chatroom](https://svelte.dev/chat). See the [migration guides](migrating) for help upgrading from older versions.
+> See the [migration guide](https://kit.svelte.dev/docs/migrating) for help migrating from Sapper to SvelteKit. If you get stuck, reach out for help in the [Discord chatroom](https://svelte.dev/chat).
 
 ### What is Sapper?
 

site/content/faq/100-version-numbers.md

@@ -3,5 +3,3 @@ question: Sapper is not 1.0 yet. Should I use it? What about SvelteKit?
 ---
 
 Sapper has been deprecated in favor of it's successor, [SvelteKit](https://kit.svelte.dev/). Please see the [migration guide](https://kit.svelte.dev/docs/migrating) for details on how to migrate to SvelteKit.
-
-Sapper and SvelteKit are operationally stable and some of the Svelte maintainers run their businesses on them. However, there will be breaking API changes before 1.0. "production readiness" is subjective, and if your requirements are fulfilled, then it's production ready. As with any software, a major version number is not an indicator of whether something is suitable for your specific use-case.

site/src/routes/index.svelte

@@ -2,63 +2,56 @@
 	import { Hero, Blurb } from '@sveltejs/site-kit';
 </script>
 
-<style>
-
-</style>
-
 <svelte:head>
-	<title>Sapper • The next small thing in web development</title>
+	<title>Sapper • The predecessor of SvelteKit</title>
 </svelte:head>
 
 <Hero
 	title="Sapper"
-	tagline="The next small thing in web development"
+	tagline="The predecessor of SvelteKit"
 	outline="sapper-logo-outline.svg"
 	logotype="sapper-logotype.svg"
 />
 
-<Blurb>
-	<a href="https://svelte.dev" slot="one">
-		<h2>Powered by Svelte</h2>
-		<p>Sapper is an application framework powered by Svelte — build bigger apps with a smaller footprint</p>
-
-		<span class="learn-more">learn more</span>
-	</a>
-
-	<a href="docs" slot="two">
-		<h2>Best of both worlds</h2>
-		<p>All the SEO and progressive enhancement of a server-rendered app, with the slick navigation of an SPA</p>
-
-		<span class="learn-more">learn more</span>
-	</a>
-
-	<a href="docs" slot="three">
-		<h2>Build fast</h2>
-		<p>Hit the ground running with advanced routing, server-side rendering, code-splitting, offline support and more</p>
-
-		<span class="learn-more">learn more</span>
-	</a>
-
-	<div class="description" slot="what">
-		<p>Sapper is a framework for building web applications of all sizes, with a beautiful development experience and flexible filesystem-based routing.</p>
-
-		<p>Unlike single-page apps, Sapper doesn't compromise on SEO, progressive enhancement or the initial load experience — but unlike traditional server-rendered apps, navigation is instantaneous for that app-like feel.</p>
-
-		<p><a href="https://svelte.dev/blog/sapper-towards-the-ideal-web-app-framework">Read the introductory blog post</a> to learn more.</p>
+<section>
+	<div class="box">
+		<h2>SvelteKit is now available</h2>
+		<p><a href="https://kit.svelte.dev/">SvelteKit</a> is the successor to Sapper. <a href="https://kit.svelte.dev/">Learn more</a>.</p>
 	</div>
+</section>
 
-	<div style="grid-area: start; display: flex; flex-direction: column; min-width: 0" slot="how">
-		<pre class="language-bash" style="margin: 0 0 1em 0; min-width: 0; min-height: 0">
-# for Rollup
-npx degit "sveltejs/sapper-template#rollup" my-app
-# for webpack
-npx degit "sveltejs/sapper-template#webpack" my-app
-cd my-app
-
-npm install
-npm run dev & open http://localhost:3000
-		</pre>
-
-		<p class="cta"><a rel="prefetch" href="docs">Learn Sapper</a></p>
-	</div>
-</Blurb>
+<style>
+	.box {
+		background: var(--prime);
+		grid-area: one / one / one / one;
+		padding: 1em;
+		display: flex;
+		flex-direction: column;
+		border-bottom: none;
+		border-radius: var(--border-r);
+		color: white;
+	}
+
+	.box a {
+		color: white;
+	}
+
+	.box h2 {
+		padding: 0;
+		margin: 0 0 0.5em 0;
+		font-size: var(--h2);
+		color: white;
+		text-align: left;
+	}
+	
+	.box p {
+		margin-bottom: 0;
+	}
+
+	section {
+		position: relative;
+		margin: 10rem auto;
+		padding: 0 var(--side-nav);
+		max-width: 120rem;
+	}
+</style>