From 7a6c4bb94b58d31fdbcae7bc7eb70ff37c1f7ed7 Mon Sep 17 00:00:00 2001
From: Luke Boswell <lukewilliamboswell@gmail.com>
Date: Wed, 2 Aug 2023 16:51:39 +1000
Subject: [PATCH 1/4] more updates to wip site

---
 www/wip_new_website/build.roc            |  9 ++++
 www/wip_new_website/content/community.md | 10 ++--
 www/wip_new_website/content/docs.md      | 16 ++++--
 www/wip_new_website/content/index.md     | 45 +++++++++-------
 www/wip_new_website/content/install.md   | 31 ++++++++---
 www/wip_new_website/content/tutorial.md  | 34 ++++++++++--
 www/wip_new_website/main.roc             | 22 ++++----
 www/wip_new_website/static/site.css      | 68 ++++++++++++++++--------
 8 files changed, 162 insertions(+), 73 deletions(-)

diff --git a/www/wip_new_website/build.roc b/www/wip_new_website/build.roc
index 50755296f0..2fb49d528d 100755
--- a/www/wip_new_website/build.roc
+++ b/www/wip_new_website/build.roc
@@ -34,6 +34,15 @@ main =
         |> Task.onErr \_ -> crash "Failed to copy static files"
         |> Task.await
 
+    # Copy font files - assume that www/build.sh has been run previously and the
+    # fonts are available locally in ../build/fonts
+    {} <- 
+        Command.new "cp"
+        |> Command.args ["-r", "../build/fonts/", "dist/fonts/"]
+        |> Command.status
+        |> Task.onErr \_ -> crash "Failed to copy static files"
+        |> Task.await
+
     # Start file server
     {} <- 
         Command.new "simple-http-server"
diff --git a/www/wip_new_website/content/community.md b/www/wip_new_website/content/community.md
index e78151d6fc..b87e517e77 100644
--- a/www/wip_new_website/content/community.md
+++ b/www/wip_new_website/content/community.md
@@ -1,6 +1,8 @@
-# Contribute to Roc
+# Community
 
-## Community Values 
+WIP
+
+## Values 
 
 <!-- 
 Work in Progress - Richard is developing this section
@@ -8,13 +10,13 @@ Work in Progress - Richard is developing this section
 Basically it will say something like we expect you to be kind, even if you think someone is being mean to you, don't assume ill intentions etc
 -->
 
-## Meet the Community
+## Meet
 
 - Group Chat [roc.zulipchat.com](https://roc.zulipchat.com/)
 - Github Project [roc-lang/roc](https://github.com/roc-lang/roc)
 - Meetups & Events
 
-## Ideas & Proposals
+## Proposals
 
 - [Good First Issues](https://github.com/roc-lang/roc/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+issue%22)
 
diff --git a/www/wip_new_website/content/docs.md b/www/wip_new_website/content/docs.md
index 764b1b5de7..c0f065a0ba 100644
--- a/www/wip_new_website/content/docs.md
+++ b/www/wip_new_website/content/docs.md
@@ -1,11 +1,17 @@
 # Documentation
 
-- Builtin Package <!-- link to builtins -->
-- Basic-CLI Platform <!-- link to docs -->
+Builtin Package - [docs](https://www.roc-lang.org/builtins)
 
-<!-- TODO Develop a Short language reference, move stuff out of tutorial e.g. de-sugaring table, keywords -->
+Basic-CLI Platform - [repo](https://github.com/roc-lang/basic-cli) - [docs](https://www.roc-lang.org/packages/basic-cli)
 
 ## Guides
 
-- [Frequently Asked Questions](https://github.com/roc-lang/roc/blob/main/FAQ.md)
-- [Roc for Elm Programmers](https://github.com/roc-lang/roc/blob/main/roc-for-elm-programmers.md)
\ No newline at end of file
+[Frequently Asked Questions](https://github.com/roc-lang/roc/blob/main/FAQ.md)
+
+[Roc for Elm Programmers](https://github.com/roc-lang/roc/blob/main/roc-for-elm-programmers.md)
+
+## Language Reference
+
+<!-- TODO Develop a Short language reference, move stuff out of tutorial e.g. de-sugaring table, keywords -->
+
+
diff --git a/www/wip_new_website/content/index.md b/www/wip_new_website/content/index.md
index 60f7c5e4b9..2ffd77e8af 100644
--- a/www/wip_new_website/content/index.md
+++ b/www/wip_new_website/content/index.md
@@ -1,30 +1,35 @@
-<!--
-The purpose of the Home page is to function as the first point of contact for all visitors. It should seamlessly connect people with the most suitable content for their immediate needs; it provides information at a high level of abstraction and guides visitors towards more relevant and detailed content within the site.
 
-This page contains minimal content, so that visitors are able to quickly scan the page. It should not be cluttered or overwhelming. It should reflect Roc's goals (fast, friendly, functional) and values (welcoming community).
--->
+# Roc
 
-# Roc lang
+A work-in-progress programming language that aims to be fast, friendly, and functional. 
 
-A systems programming language that is fast, friendly, and functional.
+Checkout the [tutorial](./wip/tutorial.html) and follow-along to see how you can build Roc applications. Along the way, you'll learn how to write tests, use the REPL, and much more!
+
+Roc doesn’t have a numbered release or an installer yet, however you find helpful instructions on the [install](./wip/install.html) page to download a nightly release, or build from source code.
+
+If you get stuck, our friendly community is always happy to help. Please open a topic in the [Roc Zulip Chat](https://roc.zulipchat.com) `#beginners` channel and let us help you!
+
+## Goals 
 
 <section class="home-goals-container">
     <div class="home-goals-column">
-      <h2 class="home-goals-title">Fast</h2>
-      <p class="home-goals-description">We want Roc to run faster than any non-systems language that sees mainstream use in industry. <a class="home-goals-learn-more" href="/design_goals.html#fast">Learn more</a></p>
+      <h3 class="home-goals-title">Fast</h3>
+      <p class="home-goals-description">Delightful software runs fast. The Roc compiler should run fast, and it should be able to produce programs that run fast too. <br><a class="home-goals-learn-more" href="/design_goals.html#fast">What does <i>fast</i> mean?</a></p>
     </div>
     <div class="home-goals-column">
-      <h2 class="home-goals-title">Friendly</h2>
-      <p class="home-goals-description">Roc aims to be a user-friendly language with a friendly community of users. <a class="home-goals-learn-more" href="/design_goals.html#friendly">Learn more</a></p>
+      <h3 class="home-goals-title">Friendly</h3>
+      <p class="home-goals-description">Roc aims to be a user-friendly language with a friendly community of users. This involves the set of tools Roc includes, and also the spirit of the community of Roc programmers. <br><a class="home-goals-learn-more" href="/design_goals.html#friendly">What does <i>friendly</i> mean?</a></p>
     </div>
     <div class="home-goals-column">
-      <h2 class="home-goals-title">Functional</h2>
-      <p class="home-goals-description">Roc aims to be a purely functional programming language. <a class="home-goals-learn-more" href="/design_goals.html#functional">Learn more</a></p>
+      <h3 class="home-goals-title">Functional</h3>
+      <p class="home-goals-description">Roc is a purely functional programming language. The language is built on a small set of simple primitives, which together give you a toolset that's more than the sum of its parts. <br><a class="home-goals-learn-more" href="/design_goals.html#functional">What does <i>functional</i> mean?</a></p>
 </section>
 
 ## Try Roc
 
-<!-- WebREPL should go here, first impression -->
+<!-- TODO WebREPL to go here -->
+
+The code below shows a Roc application which prints `Hello World!` to the terminal. It does this using the [roc-lang/basic-cli](https://github.com/roc-lang/basic-cli) platform. 
 
 ```roc
 app "hello-world"
@@ -32,24 +37,24 @@ app "hello-world"
     imports [pf.Stdout]
     provides [main] to pf
 
-main = Stdout.line "Hello, World!"
+main = 
+    Stdout.line "Hello, World!"
 ```
 
+We have developed a number of smaller code [examples](https://github.com/roc-lang/examples) which demonstrate how to use Roc. These cover a range of topics from basic syntax to more advanced features such as random number generation and using the popular `Task` feature.
+
 ## Use cases
 
 -   Tools & Scripts
--   Web (coming soon) <!-- richard starting on this -->
+-   Web (coming soon)
 -   Networking & Servers (coming soon)
 -   Graphical (coming soon)
 -   Scientific (coming soon)
 -   Embedded (coming soon)
 
-## Roc Platforms/Applications (vs libraries)
+## Platforms & Applications
 
-<!--
-provide explamation of platform/application abstraction versus libraries as common in most other languages as this is one of the most unique features of Roc
--->
-TODO 
+TODO provide explanation of platform/application abstraction versus libraries as common in most other languages as this is one of the most unique features of Roc
 
 ## Talks and Publications
 
diff --git a/www/wip_new_website/content/install.md b/www/wip_new_website/content/install.md
index 3ede7d1a85..16a23418f2 100644
--- a/www/wip_new_website/content/install.md
+++ b/www/wip_new_website/content/install.md
@@ -1,12 +1,12 @@
-# Installing Roc
+# Install Roc
 
-## Installation
+## Getting Started Guides
 
-- [Linux x86-64 Getting Started Guide](https://github.com/roc-lang/roc/blob/main/getting_started/linux_x86_64.md)
-- [MacOS Apple Silicon Getting Started Guide](https://github.com/roc-lang/roc/blob/main/getting_started/macos_apple_silicon.md)
-- [MacOS x86-64 Getting Started Guide](https://github.com/roc-lang/roc/blob/main/getting_started/macos_x86_64.md)
-- [Windows Getting Started Guide](https://github.com/roc-lang/roc/blob/main/getting_started/windows.md)
-- [Other Systems Getting Started Guide](https://github.com/roc-lang/roc/blob/main/getting_started/other.md)
+- [Linux x86-64](https://github.com/roc-lang/roc/blob/main/getting_started/linux_x86_64.md)
+- [MacOS Apple Silicon](https://github.com/roc-lang/roc/blob/main/getting_started/macos_apple_silicon.md)
+- [MacOS x86-64](https://github.com/roc-lang/roc/blob/main/getting_started/macos_x86_64.md)
+- [Windows](https://github.com/roc-lang/roc/blob/main/getting_started/windows.md)
+- [Other Systems](https://github.com/roc-lang/roc/blob/main/getting_started/other.md)
 
 ## Nightly Builds
 
@@ -27,6 +27,23 @@
 
 ## Package Management
 
+The Roc package manager is still a work in progress. In the meantime, you can use packages by including the bundle URL in your module header.
+
+Below is an example of a Roc application which uses the [roc-lang/basic-cli](https://github.com/roc-lang/basic-cli) platform and the [lukewilliamboswell/roc-json](https://github.com/lukewilliamboswell/roc-json) package by including the bundle URLs in the module header.
+
+```roc
+app "hello"
+    packages { 
+        pf: "https://github.com/roc-lang/basic-cli/releases/download/0.4.0/DI4lqn7LIZs8ZrCDUgLK-tHHpQmxGF1ZrlevRKq5LXk.tar.br",
+        json: "https://github.com/lukewilliamboswell/roc-json/releases/download/0.1.0/xbO9bXdHi7E9ja6upN5EJXpDoYm7lwmJ8VzL7a5zhYE.tar.br",
+    }
+    imports [
+        pf.Stdout,
+        json.Core,
+    ]
+    provides [main] to pf
+```
+
 <!-- 
 
 explain package manager design is still a work in progress 
diff --git a/www/wip_new_website/content/tutorial.md b/www/wip_new_website/content/tutorial.md
index 2d8346554d..9627c696cb 100644
--- a/www/wip_new_website/content/tutorial.md
+++ b/www/wip_new_website/content/tutorial.md
@@ -1,5 +1,33 @@
 # Tutorial
 
-This is a placeholder page for the Roc tutorial.
- 
-TODO move the tutorial here from `../generate_tutorial/src/input/tutorial.roc`
\ No newline at end of file
+This tutorial will teach you how to build Roc applications. Along the way, you'll learn how to write tests, use the REPL, and much more!
+
+## [Strings and Numbers](#strings-and-numbers) {#strings-and-numbers}
+
+Let's start by getting acquainted with Roc's [_Read-Eval-Print-Loop_](https://en.wikipedia.org/wiki/Read%E2%80%93eval%E2%80%93print_loop), or **REPL** for short. Run this in a terminal:
+
+<code class="block">roc repl</code>
+
+If Roc is [installed](#installation), you should see this:
+
+<pre><samp>The rockin’ roc repl</samp></pre>
+
+So far, so good!
+
+### [Hello, World!](#hello-world) {#hello-world}
+
+Try typing this in the REPL and pressing Enter:
+
+<samp class="repl-prompt">"Hello, World!"</samp>
+
+The REPL should cheerfully display the following:
+
+<pre><samp><span class="literal">"Hello, World!" </span><span class="colon">:</span> Str <span class="comment">               # val1</span></samp></pre>
+
+Congratulations! You've just written your first Roc code.
+
+### [Naming Things](#naming-things) {#naming-things}
+
+When you entered the _expression_ `"Hello, World!"`, the REPL printed it back out. It also printed `: Str`, because `Str` is that expression's type. We'll talk about types later; for now, let's ignore the `:` and whatever comes after it whenever we see them.
+
+**TODO -- move tutorial here when this site is migrated.**
\ No newline at end of file
diff --git a/www/wip_new_website/main.roc b/www/wip_new_website/main.roc
index 27fe2692fa..f1a26baa7c 100644
--- a/www/wip_new_website/main.roc
+++ b/www/wip_new_website/main.roc
@@ -1,7 +1,7 @@
 app "roc-website"
     packages { pf: "../../examples/static-site-gen/platform/main.roc" }    
     imports [
-        pf.Html.{ html, head, body, footer, p, div, main, text, nav, a, link, meta },
+        pf.Html.{ html, head, body, footer, br, div, main, text, nav, a, link, meta },
         pf.Html.Attributes.{ content, name, id, href, rel, lang, class, title, charset },
     ]
     provides [transformFileContent] to pf
@@ -49,16 +49,16 @@ view = \page, htmlContent ->
             main [] [
                 text htmlContent,
             ],
-            footer [
-                id "footer"
-            ] [
-                p [] [
-                    a [href "https://github.com/roc-lang/roc"] [text "source code repository"],
-                ],
-                # <!-- TODO FOOTER - Lanugage link to source code -->
-                text "This site is powered by ",
-                a [href "https://www.netlify.com"] [ text "Netlify"],
-                text ". Made by people who like to make nice things. © Roc 2023",
+            footer [] [
+                div [id "footer"] [
+                    text "This site is powered by ",
+                    a [href "https://www.netlify.com"] [ text "Netlify"],
+                    text ".",
+                    br [] [],
+                    text "The ",
+                    a [href "https://foundation.roc-lang.org"] [ text "Roc Programming Language Foundation"],
+                    text " is a nonprofit corporation.",
+                ]
             ]
         ],
         # TODO - add site.js if needed
diff --git a/www/wip_new_website/static/site.css b/www/wip_new_website/static/site.css
index 66781081d0..2e8f674a87 100644
--- a/www/wip_new_website/static/site.css
+++ b/www/wip_new_website/static/site.css
@@ -1,6 +1,6 @@
 :root {
     /* WCAG AAA Compliant colors */
-    --code-bg: #f4f8f9;
+    --gray-bg: #f4f8f9;
     --gray: #717171;
     --orange: #bf5000;
     --green: #0b8400;
@@ -39,10 +39,17 @@ body {
 }
 
 footer {
+    width: 100%;
+    background-color: var(--gray-bg);
+    color: var(--text-color);
+    padding: 20px;
+    text-align: center;
     font-size: 0.9rem;
+}
+
+#footer {
     max-width: 1024px;
     margin: 0 auto;
-    font-size: 14px;
 }
 
 section p:last-child {
@@ -66,8 +73,31 @@ li {
     margin-bottom: 0.5rem;
 }
 
+h1, h2, h3, h4 {
+    font-family: "Permanent Marker";
+    padding-left: 12px;
+}
+
+h1 {
+    color: var(--green);
+    font-size: 5rem;
+    text-shadow: 1px 1px 1px #010101;
+}
+
+h2 {
+    color: var(--violet);
+    font-size: 3rem;
+    text-shadow: 1px 1px 1px #010101;
+}
+
+h3 {
+    color: var(--cyan);
+    font-size: 1.5rem;
+    text-shadow: 1px 1px 1px #010101;
+}
+
 #top-bar {
-    background-color: var(--violet-bg);
+    background-color: var(--gray-bg);
     width: 100%;
     height: 50px;
 }
@@ -102,24 +132,24 @@ li {
 }
 
 main {
-    max-width: var(--body-max-width);
-    margin: 36px auto;
-    padding: 0 12px;
+    max-width: 1024px;
+    margin: auto;
+    padding: 12px;
 }
 
 code,
 samp {
     font-family: var(--font-mono);
     color: var(--code-color);
-    background-color: var(--code-bg);
+    background-color: var(--gray-bg);
     display: inline-block;
+    padding: 0;
 }
 
 p code,
 td code,
 li code,
-th code,
-samp {
+th code {
     padding: 0 8px;
 }
 
@@ -141,7 +171,7 @@ pre {
     margin-bottom: 16px;
     padding: 8px 16px;
     box-sizing: border-box;
-    background-color: var(--code-bg);
+    background-color: var(--gray-bg);
     overflow-x: hidden;
     word-wrap: normal;
     font-size: 1.2rem;
@@ -199,8 +229,7 @@ td:last-child {
 
 p,
 aside,
-li,
-footer {
+li {
     font-size: 1.2rem;
     line-height: 1.85rem;
 }
@@ -402,7 +431,7 @@ footer {
     :root {
         /* WCAG AAA Compliant colors */
         /* WCAG AAA Compliant colors */
-        --code-bg: #202746;
+        --gray-bg: #202746;
         --gray: #b6b6b6;
         --orange: #fd6e08;
         --green: #8ecc88;
@@ -527,7 +556,7 @@ code .dim {
 }
 
 .copy-button {
-    background: var(--code-bg);
+    background: var(--gray-bg);
     border: 1px solid var(--magenta);
     color: var(--magenta);
     display: inline-block;
@@ -554,7 +583,7 @@ code .dim {
 .home-goals-column {
     flex-basis: 30%;
     padding: 20px;
-    background-color: var(--violet-bg);
+    background-color: var(--gray-bg);
     margin-right: 20px;
 }
 
@@ -563,7 +592,7 @@ code .dim {
 }
 
 .home-goals-title {
-    font-size: 18px;
+    padding: 0;
     font-weight: bold;
     margin-bottom: 10px;
 }
@@ -578,10 +607,3 @@ code .dim {
     color: var(--violet);
     text-decoration: none;
 }
-
-#footer {
-    background-color: var(--violet-bg);
-    color: var(--text-color);
-    padding: 20px;
-    text-align: center;
-  }
\ No newline at end of file

From ad67669d178ba8defd470c25e6fb7b66d3d3fc2a Mon Sep 17 00:00:00 2001
From: Luke Boswell <lukewilliamboswell@gmail.com>
Date: Wed, 2 Aug 2023 17:06:07 +1000
Subject: [PATCH 2/4] fix broken reported markdown links

---
 www/wip_new_website/content/index.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/www/wip_new_website/content/index.md b/www/wip_new_website/content/index.md
index 2ffd77e8af..8cd49e1bcd 100644
--- a/www/wip_new_website/content/index.md
+++ b/www/wip_new_website/content/index.md
@@ -3,9 +3,9 @@
 
 A work-in-progress programming language that aims to be fast, friendly, and functional. 
 
-Checkout the [tutorial](./wip/tutorial.html) and follow-along to see how you can build Roc applications. Along the way, you'll learn how to write tests, use the REPL, and much more!
+Checkout the [tutorial](/wip/tutorial.html) and follow-along to see how you can build Roc applications. Along the way, you'll learn how to write tests, use the REPL, and much more!
 
-Roc doesn’t have a numbered release or an installer yet, however you find helpful instructions on the [install](./wip/install.html) page to download a nightly release, or build from source code.
+Roc doesn’t have a numbered release or an installer yet, however you find helpful instructions on the [install](/wip/install.html) page to download a nightly release, or build from source code.
 
 If you get stuck, our friendly community is always happy to help. Please open a topic in the [Roc Zulip Chat](https://roc.zulipchat.com) `#beginners` channel and let us help you!
 

From 519eb9625c55827af8451f14b095658c763826bb Mon Sep 17 00:00:00 2001
From: Anton-4 <17049058+Anton-4@users.noreply.github.com>
Date: Wed, 2 Aug 2023 11:28:20 +0200
Subject: [PATCH 3/4] ignore local html files

Signed-off-by: Anton-4 <17049058+Anton-4@users.noreply.github.com>
---
 mlc_config.json | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/mlc_config.json b/mlc_config.json
index c8341a6907..836c777d82 100644
--- a/mlc_config.json
+++ b/mlc_config.json
@@ -44,6 +44,9 @@
         },
         {
             "pattern": "https://liberapay.com/"
+        },
+        {
+            "pattern": "*.html"
         }
     ]
 }

From 7598b080f15b5070a2b202efdf1f91e771ac02c3 Mon Sep 17 00:00:00 2001
From: Anton-4 <17049058+Anton-4@users.noreply.github.com>
Date: Sat, 5 Aug 2023 14:35:45 +0200
Subject: [PATCH 4/4] small improvements

---
 www/build.sh                           |  1 +
 www/wip_new_website/build.roc          | 16 +++++------
 www/wip_new_website/content/index.md   | 15 +++++-----
 www/wip_new_website/content/install.md | 20 +++++++------
 www/wip_new_website/main.roc           |  8 +-----
 www/wip_new_website/static/site.css    | 40 ++++++++++++++------------
 6 files changed, 51 insertions(+), 49 deletions(-)

diff --git a/www/build.sh b/www/build.sh
index 608637886a..64ead923f6 100755
--- a/www/build.sh
+++ b/www/build.sh
@@ -95,6 +95,7 @@ mv www/build/tutorial/tutorial.html www/build/tutorial/index.html
 mkdir www/build/wip
 $roc run www/wip_new_website/main.roc -- www/wip_new_website/content/ www/build/wip
 cp -r www/wip_new_website/static/site.css www/build/wip
+cp -r www/build/fonts www/build/wip/fonts
 
 # cleanup
 rm -rf roc_nightly roc_releases.json
diff --git a/www/wip_new_website/build.roc b/www/wip_new_website/build.roc
index 2fb49d528d..ab4bd61551 100755
--- a/www/wip_new_website/build.roc
+++ b/www/wip_new_website/build.roc
@@ -1,6 +1,6 @@
 #!/usr/bin/env roc
 app "website-builder"
-    packages { pf: "https://github.com/roc-lang/basic-cli/releases/download/0.4.0-rc1/hbIodFf7kULTYZJkzgsvgsnFAvQexm5hVeBaOMZk84I.tar.br" }
+    packages { pf: "https://github.com/roc-lang/basic-cli/releases/download/0.4.0/DI4lqn7LIZs8ZrCDUgLK-tHHpQmxGF1ZrlevRKq5LXk.tar.br" }
     imports [
         pf.Task.{ Task },
         pf.Command,
@@ -15,7 +15,7 @@ main =
         Command.new "rm"
         |> Command.args ["-rf", "dist/"]
         |> Command.status
-        |> Task.onErr \_ -> crash "Failed to remove dist folder"
+        |> Task.onFail \_ -> crash "Failed to remove dist folder"
         |> Task.await
 
     # Build site
@@ -23,7 +23,7 @@ main =
         Command.new "roc"
         |> Command.args ["run", "main.roc", "--", "content/", "dist/wip/"]
         |> Command.status
-        |> Task.onErr \_ -> crash "Failed to build site"
+        |> Task.onFail \_ -> crash "Failed to build site"
         |> Task.await
 
     # Copy static files
@@ -31,7 +31,7 @@ main =
         Command.new "cp"
         |> Command.args ["-r", "static/site.css", "dist/wip/"]
         |> Command.status
-        |> Task.onErr \_ -> crash "Failed to copy static files"
+        |> Task.onFail \_ -> crash "Failed to copy static files"
         |> Task.await
 
     # Copy font files - assume that www/build.sh has been run previously and the
@@ -40,15 +40,15 @@ main =
         Command.new "cp"
         |> Command.args ["-r", "../build/fonts/", "dist/fonts/"]
         |> Command.status
-        |> Task.onErr \_ -> crash "Failed to copy static files"
+        |> Task.onFail \_ -> crash "Failed to copy static files"
         |> Task.await
 
     # Start file server
     {} <- 
         Command.new "simple-http-server"
-        |> Command.args ["-p", "8080", "--", "dist/"]
+        |> Command.args ["-p", "8080", "--nocache", "--index", "--", "dist/"]
         |> Command.status
-        |> Task.onErr \_ -> crash "Failed to run file server; consider intalling with `cargo install simple-http-server`"
+        |> Task.onFail \_ -> crash "Failed to run file server; consider intalling with `cargo install simple-http-server`"
         |> Task.await
 
-    Task.ok {}
+    Task.succeed {}
diff --git a/www/wip_new_website/content/index.md b/www/wip_new_website/content/index.md
index 8cd49e1bcd..7df0ac858a 100644
--- a/www/wip_new_website/content/index.md
+++ b/www/wip_new_website/content/index.md
@@ -1,28 +1,29 @@
 
 # Roc
 
-A work-in-progress programming language that aims to be fast, friendly, and functional. 
+Work in progress! 
 
-Checkout the [tutorial](/wip/tutorial.html) and follow-along to see how you can build Roc applications. Along the way, you'll learn how to write tests, use the REPL, and much more!
+<!-- TODO turn these into nice buttons -->
+- [tutorial](/wip/tutorial.html)
 
-Roc doesn’t have a numbered release or an installer yet, however you find helpful instructions on the [install](/wip/install.html) page to download a nightly release, or build from source code.
+- [install](/wip/install.html)
 
-If you get stuck, our friendly community is always happy to help. Please open a topic in the [Roc Zulip Chat](https://roc.zulipchat.com) `#beginners` channel and let us help you!
+- [help / group chat](https://roc.zulipchat.com), we're friendly!
 
 ## Goals 
 
 <section class="home-goals-container">
     <div class="home-goals-column">
       <h3 class="home-goals-title">Fast</h3>
-      <p class="home-goals-description">Delightful software runs fast. The Roc compiler should run fast, and it should be able to produce programs that run fast too. <br><a class="home-goals-learn-more" href="/design_goals.html#fast">What does <i>fast</i> mean?</a></p>
+      <p class="home-goals-description">Runs fast, compiles fast. <br><a class="home-goals-learn-more" href="/design_goals.html#fast">Learn more</a></p>
     </div>
     <div class="home-goals-column">
       <h3 class="home-goals-title">Friendly</h3>
-      <p class="home-goals-description">Roc aims to be a user-friendly language with a friendly community of users. This involves the set of tools Roc includes, and also the spirit of the community of Roc programmers. <br><a class="home-goals-learn-more" href="/design_goals.html#friendly">What does <i>friendly</i> mean?</a></p>
+      <p class="home-goals-description">User-friendly language, friendly community. <br><a class="home-goals-learn-more" href="/design_goals.html#friendly">Learn more</a></p>
     </div>
     <div class="home-goals-column">
       <h3 class="home-goals-title">Functional</h3>
-      <p class="home-goals-description">Roc is a purely functional programming language. The language is built on a small set of simple primitives, which together give you a toolset that's more than the sum of its parts. <br><a class="home-goals-learn-more" href="/design_goals.html#functional">What does <i>functional</i> mean?</a></p>
+      <p class="home-goals-description">Pure functional programming, keep it simple.<br><a class="home-goals-learn-more" href="/design_goals.html#functional">Learn more</a></p>
 </section>
 
 ## Try Roc
diff --git a/www/wip_new_website/content/install.md b/www/wip_new_website/content/install.md
index 16a23418f2..ae76396cae 100644
--- a/www/wip_new_website/content/install.md
+++ b/www/wip_new_website/content/install.md
@@ -1,6 +1,6 @@
 # Install Roc
 
-## Getting Started Guides
+<!-- TODO detect current OS with browser and only show link for that, provide other button for others  -->
 
 - [Linux x86-64](https://github.com/roc-lang/roc/blob/main/getting_started/linux_x86_64.md)
 - [MacOS Apple Silicon](https://github.com/roc-lang/roc/blob/main/getting_started/macos_apple_silicon.md)
@@ -8,11 +8,9 @@
 - [Windows](https://github.com/roc-lang/roc/blob/main/getting_started/windows.md)
 - [Other Systems](https://github.com/roc-lang/roc/blob/main/getting_started/other.md)
 
-## Nightly Builds
+## Nightly
 
-<!-- direct download links to builds should go here -->
-
-[nightly builds](https://github.com/roc-lang/roc/releases)
+<!-- link to nightly for currently detected OS(browser) and provide "other" button to reveal all -->
 
 ## Roc CLI
 
@@ -27,14 +25,14 @@
 
 ## Package Management
 
-The Roc package manager is still a work in progress. In the meantime, you can use packages by including the bundle URL in your module header.
-
-Below is an example of a Roc application which uses the [roc-lang/basic-cli](https://github.com/roc-lang/basic-cli) platform and the [lukewilliamboswell/roc-json](https://github.com/lukewilliamboswell/roc-json) package by including the bundle URLs in the module header.
+You can include packages using an URL:
 
 ```roc
 app "hello"
     packages { 
+        # basic-cli platform
         pf: "https://github.com/roc-lang/basic-cli/releases/download/0.4.0/DI4lqn7LIZs8ZrCDUgLK-tHHpQmxGF1ZrlevRKq5LXk.tar.br",
+        # json package
         json: "https://github.com/lukewilliamboswell/roc-json/releases/download/0.1.0/xbO9bXdHi7E9ja6upN5EJXpDoYm7lwmJ8VzL7a5zhYE.tar.br",
     }
     imports [
@@ -44,6 +42,8 @@ app "hello"
     provides [main] to pf
 ```
 
+A full Roc package manager will be developed in the future.
+
 <!-- 
 
 explain package manager design is still a work in progress 
@@ -52,6 +52,8 @@ the plan is to create a centralised index
 - a fact that every language will have one
 
 in the meantime you can use package URLs
+
+TODO Add an explanation for the URLs with the SHA and the tar.br. This explanation should only be revealed on click.
 -->
 
 ## Editor Support
@@ -61,6 +63,8 @@ explain that the high level design is a work in progress
 - Design goals for editor - we want Roc to ship with an awesome editor
 - Beginners learning to get up an running with an editor
 - Want it to run really fast etc
+
+- Also link to VScode plugin
 -->
 
 - Language Server
diff --git a/www/wip_new_website/main.roc b/www/wip_new_website/main.roc
index f1a26baa7c..7ffaf0dded 100644
--- a/www/wip_new_website/main.roc
+++ b/www/wip_new_website/main.roc
@@ -51,13 +51,8 @@ view = \page, htmlContent ->
             ],
             footer [] [
                 div [id "footer"] [
-                    text "This site is powered by ",
+                    text " powered by ",
                     a [href "https://www.netlify.com"] [ text "Netlify"],
-                    text ".",
-                    br [] [],
-                    text "The ",
-                    a [href "https://foundation.roc-lang.org"] [ text "Roc Programming Language Foundation"],
-                    text " is a nonprofit corporation.",
                 ]
             ]
         ],
@@ -86,7 +81,6 @@ viewNavbar =
 rocLogo = 
     (Html.element "svg") [
             (Html.attribute "viewBox") "0 -6 51 58",
-            (Html.attribute "fill") "#7c38f5",
             (Html.attribute "xmlns") "http://www.w3.org/2000/svg",
             (Html.attribute "aria-labelledby") "logo-link",
             (Html.attribute "role") "img",
diff --git a/www/wip_new_website/static/site.css b/www/wip_new_website/static/site.css
index 2e8f674a87..8b783552da 100644
--- a/www/wip_new_website/static/site.css
+++ b/www/wip_new_website/static/site.css
@@ -10,10 +10,12 @@
     --violet-bg: #ece2fd;
     --magenta: #a20031;
 
-    --link-color: var(--violet);
-    --code-link-color: var(--violet);
+    --primary-1: #9b6bf2;
+    --primary-2: #7c38f5;
+    --link-color: var(--primary-2);
+    --code-link-color: var(--primary-2);
     --text-color: #000;
-    --text-hover-color: var(--violet);
+    --text-hover-color: var(--primary-2);
     --body-bg-color: #ffffff;
     --border-color: #717171;
     --faded-color: #4c4c4c;
@@ -23,6 +25,8 @@
         monospace;
     --top-header-height: 67px;
     --sidebar-width: 280px;
+
+    --font-size-normal: 1rem;
 }
 
 html {
@@ -40,11 +44,10 @@ body {
 
 footer {
     width: 100%;
-    background-color: var(--gray-bg);
     color: var(--text-color);
     padding: 20px;
     text-align: center;
-    font-size: 0.9rem;
+    font-size: var(--font-size-normal);
 }
 
 #footer {
@@ -79,13 +82,13 @@ h1, h2, h3, h4 {
 }
 
 h1 {
-    color: var(--green);
+    color: var(--primary-1);
     font-size: 5rem;
     text-shadow: 1px 1px 1px #010101;
 }
 
 h2 {
-    color: var(--violet);
+    color: var(--primary-1);
     font-size: 3rem;
     text-shadow: 1px 1px 1px #010101;
 }
@@ -93,7 +96,6 @@ h2 {
 h3 {
     color: var(--cyan);
     font-size: 1.5rem;
-    text-shadow: 1px 1px 1px #010101;
 }
 
 #top-bar {
@@ -124,7 +126,7 @@ h3 {
 #top-bar-links label {
     box-sizing: border-box;
     color: var(--top-bar-fg);
-    font-size: 1.1rem;
+    font-size: var(--font-size-normal);
     display: block;
     height: 40px;
     padding: 12px 16px;
@@ -174,7 +176,7 @@ pre {
     background-color: var(--gray-bg);
     overflow-x: hidden;
     word-wrap: normal;
-    font-size: 1.2rem;
+    font-size: var(--font-size-normal);
     line-height: 1.76em;
     white-space: pre;
 }
@@ -230,7 +232,7 @@ td:last-child {
 p,
 aside,
 li {
-    font-size: 1.2rem;
+    font-size: var(--font-size-normal);
     line-height: 1.85rem;
 }
 
@@ -437,12 +439,11 @@ li {
         --green: #8ecc88;
         --cyan: #12c9be;
         --blue: #b1afdf;
-        --violet: #caadfb;
         --violet-bg: #332944;
         --magenta: #f39bac;
 
-        --link-color: var(--violet);
-        --code-link-color: var(--violet);
+        --primary-1: #9c7cea;
+        --primary-2: #1bd6bd;
         --text-color: #eaeaea;
         --body-bg-color: #0e0e0f;
         --border-color: var(--gray);
@@ -452,6 +453,10 @@ li {
         --gray: #6e6e6e;
     }
 
+    h3 {
+        color: var(--primary-2);
+    }
+
     h1,
     h2,
     h3,
@@ -573,6 +578,8 @@ code .dim {
     width: 40px;
     height: 40px;
     margin: 0 auto;
+    fill: var(--primary-1);
+    text-shadow: 1px 1px 1px #010101;
 }
 
 .home-goals-container {
@@ -602,8 +609,3 @@ code .dim {
     line-height: 1.5;
     margin-bottom: 10px;
 }
-
-.home-goals-learn-more {
-    color: var(--violet);
-    text-decoration: none;
-}