From d695da71dd6acc3023d101684e4292c1ec653e0c Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Sun, 21 Apr 2019 21:20:53 -0400 Subject: [PATCH 01/16] better error pages --- site/src/routes/_error.svelte | 70 +++++++++++++++++++++++++++-------- 1 file changed, 54 insertions(+), 16 deletions(-) diff --git a/site/src/routes/_error.svelte b/site/src/routes/_error.svelte index 45dfbaef97..0071e3cea7 100644 --- a/site/src/routes/_error.svelte +++ b/site/src/routes/_error.svelte @@ -1,33 +1,71 @@ - - - {status} - -

{status}

- -

{error.message}

- -{#if dev && error.stack} - 
{error.stack}
-{/if} + // we don't want to use here, + // because we only care about the online state when + // the page first loads + let online = typeof navigator !== 'undefined' + ? navigator.onLine + : true; + \ No newline at end of file + + /* @media (min-width: 480px) { + h1 { font-size: 4em } + } */ + + + + {status} + + +
+ {#if online} +

Yikes!

+ + {#if error.message} +

{status}: {error.message}

+ {:else} +

Encountered a {status} error

+ {/if} + + {#if dev && error.stack} + 
{error.stack}
+ {:else} + {#if status >= 500} +

Please try reloading the page.

+ {/if} + +

If the error persists, please drop by Discord chatroom and let us know, or raise an issue on GitHub. Thanks!

+ {/if} + {:else} +

It looks like you're offline

+ +

Reload the page once you've found the internet.

+ {/if} +
\ No newline at end of file From d07fa3332a0d613c1403b22da2488ca3e85385b9 Mon Sep 17 00:00:00 2001 From: Luke Edwards Date: Sun, 21 Apr 2019 22:24:32 -0700 Subject: [PATCH 02/16] =?UTF-8?q?site:=20remove=20=E2=80=9Ccompression?= =?UTF-8?q?=E2=80=9D=20lib;?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - handled better by Cloudflare --- site/package-lock.json | 63 ++++++++---------------------------------- site/package.json | 1 - site/src/server.js | 4 +-- 3 files changed, 12 insertions(+), 56 deletions(-) diff --git a/site/package-lock.json b/site/package-lock.json index b977151326..47fba5c0b5 100644 --- a/site/package-lock.json +++ b/site/package-lock.json @@ -1917,28 +1917,6 @@ "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY=", "dev": true }, - "compressible": { - "version": "2.0.16", - "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.16.tgz", - "integrity": "sha512-JQfEOdnI7dASwCuSPWIeVYwc/zMsu/+tRhoUvEfXz2gxOA2DNjmG5vhtFdBlhWPPGo+RdT9S3tgc/uH5qgDiiA==", - "requires": { - "mime-db": ">= 1.38.0 < 2" - } - }, - "compression": { - "version": "1.7.4", - "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.4.tgz", - "integrity": "sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==", - "requires": { - "accepts": "~1.3.5", - "bytes": "3.0.0", - "compressible": "~2.0.16", - "debug": "2.6.9", - "on-headers": "~1.0.2", - "safe-buffer": "5.1.2", - "vary": "~1.1.2" - } - }, "concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", @@ -2617,8 +2595,7 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", - "dev": true, - "optional": true + "dev": true }, "aproba": { "version": "1.2.0", @@ -2642,15 +2619,13 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", - "dev": true, - "optional": true + "dev": true }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", "dev": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -2667,22 +2642,19 @@ "version": "1.1.0", "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz", "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=", - "dev": true, - "optional": true + "dev": true }, "concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", - "dev": true, - "optional": true + "dev": true }, "console-control-strings": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz", "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=", - "dev": true, - "optional": true + "dev": true }, "core-util-is": { "version": "1.0.2", @@ -2813,8 +2785,7 @@ "version": "2.0.3", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=", - "dev": true, - "optional": true + "dev": true }, "ini": { "version": "1.3.5", @@ -2828,7 +2799,6 @@ "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz", "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=", "dev": true, - "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -2845,7 +2815,6 @@ "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", "dev": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -2854,15 +2823,13 @@ "version": "0.0.8", "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=", - "dev": true, - "optional": true + "dev": true }, "minipass": { "version": "2.3.5", "resolved": "https://registry.npmjs.org/minipass/-/minipass-2.3.5.tgz", "integrity": "sha512-Gi1W4k059gyRbyVUZQ4mEqLm0YIUiGYfvxhF6SIlk3ui1WVxMTGfGdQ2SInh3PDrRTVvPKgULkpJtT4RH10+VA==", "dev": true, - "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -2883,7 +2850,6 @@ "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", "dev": true, - "optional": true, "requires": { "minimist": "0.0.8" } @@ -2972,8 +2938,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz", "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", - "dev": true, - "optional": true + "dev": true }, "object-assign": { "version": "4.1.1", @@ -2987,7 +2952,6 @@ "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", "dev": true, - "optional": true, "requires": { "wrappy": "1" } @@ -3083,8 +3047,7 @@ "version": "5.1.2", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", - "dev": true, - "optional": true + "dev": true }, "safer-buffer": { "version": "2.1.2", @@ -3126,7 +3089,6 @@ "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "dev": true, - "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -3148,7 +3110,6 @@ "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", "dev": true, - "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -3197,15 +3158,13 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", - "dev": true, - "optional": true + "dev": true }, "yallist": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.3.tgz", "integrity": "sha512-S+Zk8DEWE6oKpV+vI3qWkaK+jSbIK86pCwe2IF/xwIpQ8jEuxpw9NyaGjmp9+BoJv5FV2piqCDcoCtStppiq2A==", - "dev": true, - "optional": true + "dev": true } } }, diff --git a/site/package.json b/site/package.json index 8fff42e6c1..de822e4faa 100644 --- a/site/package.json +++ b/site/package.json @@ -15,7 +15,6 @@ }, "dependencies": { "codemirror": "^5.44.0", - "compression": "^1.7.3", "devalue": "^1.1.0", "do-not-zip": "^1.0.0", "dotenv": "^6.2.0", diff --git a/site/src/server.js b/site/src/server.js index 084b52b5b6..7c31cf18cf 100644 --- a/site/src/server.js +++ b/site/src/server.js @@ -1,6 +1,5 @@ import 'dotenv/config'; import express from 'express'; -import compression from 'compression'; import session from 'express-session'; import passport from 'passport'; import { Strategy } from 'passport-github'; @@ -93,7 +92,6 @@ if (process.env.GITHUB_CLIENT_ID) { } app.use( - compression({ threshold: 0 }), serve('static', { setHeaders: res => res.setHeader('Access-Control-Allow-Origin', '*') }), sapper.middleware({ // TODO update Sapper so that we can pass props to the client @@ -111,4 +109,4 @@ app.use( }; } }) -).listen(process.env.PORT); \ No newline at end of file +).listen(process.env.PORT); From 24f9c6c65833206bc691fac2d6b69256fc32e5c8 Mon Sep 17 00:00:00 2001 From: Luke Edwards Date: Sun, 21 Apr 2019 22:31:50 -0700 Subject: [PATCH 03/16] fix(site): remove "dotenv" from runtime --- site/package-lock.json | 7 ++++--- site/package.json | 2 +- site/src/server.js | 1 - 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/site/package-lock.json b/site/package-lock.json index 47fba5c0b5..e01503eba7 100644 --- a/site/package-lock.json +++ b/site/package-lock.json @@ -2130,9 +2130,10 @@ "dev": true }, "dotenv": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-6.2.0.tgz", - "integrity": "sha512-HygQCKUBSFl8wKQZBSemMywRWcEDNidvNbjGVyZu3nbZ8qq9ubiPoGLMdRDpfSrpkkm9BXYFkpKxxFX38o/76w==" + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-7.0.0.tgz", + "integrity": "sha512-M3NhsLbV1i6HuGzBUH8vXrtxOk+tWmzWKDMbAVSUp3Zsjm7ywFeuwrUXhmhQyRK1q5B5GGy7hcXPbj3bnfZg2g==", + "dev": true }, "ee-first": { "version": "1.1.1", diff --git a/site/package.json b/site/package.json index de822e4faa..5f31257942 100644 --- a/site/package.json +++ b/site/package.json @@ -17,7 +17,6 @@ "codemirror": "^5.44.0", "devalue": "^1.1.0", "do-not-zip": "^1.0.0", - "dotenv": "^6.2.0", "express": "^4.16.4", "express-session": "^1.15.6", "golden-fleece": "^1.0.9", @@ -41,6 +40,7 @@ "@sveltejs/svelte-repl": "0.0.10", "chokidar": "^2.1.2", "degit": "^2.1.3", + "dotenv": "^7.0.0", "eslint-plugin-svelte3": "^0.4.4", "esm": "^3.2.22", "jimp": "^0.6.0", diff --git a/site/src/server.js b/site/src/server.js index 7c31cf18cf..6d9a9539b7 100644 --- a/site/src/server.js +++ b/site/src/server.js @@ -1,4 +1,3 @@ -import 'dotenv/config'; import express from 'express'; import session from 'express-session'; import passport from 'passport'; From 3900a0b9d790668d2a06bf85fe3fcec4daca45b8 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Mon, 22 Apr 2019 06:38:31 -0400 Subject: [PATCH 04/16] fix opacity on examples TOC --- .../routes/examples/_TableOfContents.svelte | 74 +++++++++---------- 1 file changed, 36 insertions(+), 38 deletions(-) diff --git a/site/src/routes/examples/_TableOfContents.svelte b/site/src/routes/examples/_TableOfContents.svelte index a3e8b23216..d23925a0c3 100644 --- a/site/src/routes/examples/_TableOfContents.svelte +++ b/site/src/routes/examples/_TableOfContents.svelte @@ -40,7 +40,7 @@ border-right: 1px solid var(--second); background-color: var(--second); color: white; - padding: 2em 2em 0 2em; + padding: 3rem 3rem 0 3rem; } .examples-toc li { @@ -49,13 +49,6 @@ margin: 0 0 4.8rem 0; } - a { - position: relative; - opacity: 0.7; - transition: opacity 0.2s; - color: white; - } - .section-title { display: block; padding: 0 0 .8rem 0; @@ -74,35 +67,43 @@ .example-title:hover { color: var(--flash); - opacity: 1 } - .active { - opacity: 1; + /* .active { font-weight: 600; - } + } */ - .row { - position: relative; - margin: 0.5em 0; + a { display: flex; + position: relative; + color: white; + border-bottom: none; + padding: 0.2rem 3rem; + margin: 0 -3rem; + /* margin: 0.5em 0; */ align-items: center; - justify-content: space-between; + justify-content: start; } - .info { - display: flex; - align-items: center; + a:hover { + color: var(--flash); + } + + a.active { + background: rgba(255, 255, 255, 0.1) calc(100% - 3rem) 50% no-repeat url(/icons/arrow-right.svg); + background-size: 1em 1em; + color: white; } .thumbnail { - background: white 50% 50% no-repeat; - background-size: contain; + background-color: white; + object-fit: contain; width: 5rem; height: 5rem; - border: 1px solid #ccc; + /* border: 1px solid #ccc; */ border-radius: 2px; box-shadow: 1px 1px 3px rgba(0,0,0,0.13); + margin: 0.2em 0.5em 0.2em 0; } @@ -114,25 +115,22 @@ {#each section.examples as example} - -
-
-
-
- {example.title} -
-
- {#if example.slug === active_section} - - {/if} -
- + {example.title} thumbnail + + {example.title} + + {/each} {/each} From 14d68cbbf443f36b4676562dfea9f1a117ddecf2 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Mon, 22 Apr 2019 06:43:30 -0400 Subject: [PATCH 05/16] remove some unused code --- .../routes/examples/_TableOfContents.svelte | 53 +------------------ 1 file changed, 2 insertions(+), 51 deletions(-) diff --git a/site/src/routes/examples/_TableOfContents.svelte b/site/src/routes/examples/_TableOfContents.svelte index d23925a0c3..ec7310c5fa 100644 --- a/site/src/routes/examples/_TableOfContents.svelte +++ b/site/src/routes/examples/_TableOfContents.svelte @@ -1,36 +1,6 @@ -
    +
      {#each sections as section}
    • @@ -127,9 +81,6 @@ > {example.title} - {/each}
      • From 221e70a29c1656cf4a226098106dc756f7aab260 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Mon, 22 Apr 2019 07:03:43 -0400 Subject: [PATCH 06/16] add video to blog post, remove draft flag --- ...2019-04-22-svelte-3-rethinking-reactivity.md} | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) rename site/content/blog/{2019-04-18-svelte-3-rethinking-reactivity.md => 2019-04-22-svelte-3-rethinking-reactivity.md} (90%) diff --git a/site/content/blog/2019-04-18-svelte-3-rethinking-reactivity.md b/site/content/blog/2019-04-22-svelte-3-rethinking-reactivity.md similarity index 90% rename from site/content/blog/2019-04-18-svelte-3-rethinking-reactivity.md rename to site/content/blog/2019-04-22-svelte-3-rethinking-reactivity.md index d00a680426..dcb8c50fc0 100644 --- a/site/content/blog/2019-04-18-svelte-3-rethinking-reactivity.md +++ b/site/content/blog/2019-04-22-svelte-3-rethinking-reactivity.md @@ -1,9 +1,8 @@ --- -title: Svelte 3: Rethinking Reactivity +title: Svelte 3: Rethinking reactivity description: It's finally here author: Rich Harris authorURL: https://twitter.com/Rich_Harris -draft: true --- After several months of being just days away, we are over the moon to announce the stable release of Svelte 3. This is a huge release representing hundreds of hours of work by many people in the Svelte community, including invaluable feedback from beta testers who have helped shape the design every step of the way. @@ -23,14 +22,15 @@ Version 3 is a significant overhaul. Our focus for the last five or six months h To make that possible we first needed to rethink the concept at the heart of modern UI frameworks: reactivity. -
      -Rich Harris delivering a conference talk at You Gotta Love Frontend +
      +
      +
      + +
      -
      TKTKTK replace this with a video embed once the YGLF videos appear on YouTube
      +
      'Rethinking Reactivity' from You Gotta Love Frontend Code Camp
      +
      ## Moving reactivity into the language From 263c6904fca1e84a95a28b1b2ad82c8096d258d6 Mon Sep 17 00:00:00 2001 From: Achim Vedam Date: Mon, 22 Apr 2019 13:20:57 +0200 Subject: [PATCH 07/16] closes #2482 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit • fix missing :hover-state in TopNav --- site/src/components/TopNav.svelte | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/site/src/components/TopNav.svelte b/site/src/components/TopNav.svelte index c135ac12f0..4254e99152 100644 --- a/site/src/components/TopNav.svelte +++ b/site/src/components/TopNav.svelte @@ -185,6 +185,10 @@ transition: none; } + li:not(.active) a:hover { + color: var(--flash); + } + @media (min-width: 840px) { ul { padding: 0; From db3c03f18c42e84c058c08ea27a9387a192c23d5 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Mon, 22 Apr 2019 07:26:25 -0400 Subject: [PATCH 08/16] work around transition bug --- site/src/components/PreloadingIndicator.svelte | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/site/src/components/PreloadingIndicator.svelte b/site/src/components/PreloadingIndicator.svelte index 22980e2a6b..cc7d2ef057 100644 --- a/site/src/components/PreloadingIndicator.svelte +++ b/site/src/components/PreloadingIndicator.svelte @@ -3,6 +3,7 @@ import { fade } from 'svelte/transition'; let p = 0; + let visible = false; const sleep = ms => new Promise(f => setTimeout(f, ms)); @@ -10,6 +11,7 @@ let running = true; function next() { + visible = true; p += 0.1; const remaining = 1 - p; @@ -53,7 +55,7 @@ } -{#if p > 0} +{#if visible}
      From dc9977852ed8a46d461ccda53c7ea1a3cabd8f56 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Mon, 22 Apr 2019 08:02:46 -0400 Subject: [PATCH 09/16] fix gist icon in REPL --- site/src/routes/repl/_components/AppControls/index.svelte | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/site/src/routes/repl/_components/AppControls/index.svelte b/site/src/routes/repl/_components/AppControls/index.svelte index 368136bb6e..179a8e4470 100644 --- a/site/src/routes/repl/_components/AppControls/index.svelte +++ b/site/src/routes/repl/_components/AppControls/index.svelte @@ -232,7 +232,7 @@ export default app;` }); {/if} {#if gist} - + {/if} @@ -272,6 +272,7 @@ export default app;` }); transition: opacity .3s; font-family: var(--font); font-size: 1.6rem; + color: white; /* width: 1.6em; height: 1.6em; */ line-height: 1; From 48f5db7309540b9206172cbfea2ff6d15a668621 Mon Sep 17 00:00:00 2001 From: Richard Harris Date: Mon, 22 Apr 2019 08:34:30 -0400 Subject: [PATCH 10/16] surely this will fix it --- site/src/components/PreloadingIndicator.svelte | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/site/src/components/PreloadingIndicator.svelte b/site/src/components/PreloadingIndicator.svelte index cc7d2ef057..43bcf3ab5a 100644 --- a/site/src/components/PreloadingIndicator.svelte +++ b/site/src/components/PreloadingIndicator.svelte @@ -1,6 +1,5 @@