From 18eca59c27fc76eb2b22d4d6abe8fd4bb473b7e2 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 24 Oct 2024 22:50:04 -0400 Subject: [PATCH 1/5] reduce width a smidge --- packages/site-kit/src/lib/styles/tokens.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 35ff58a2da..9ab43d1b33 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -19,7 +19,7 @@ --sk-page-padding-side: 1.6rem; --sk-thick-border-width: 0.3rem; --sk-border-radius: 0.4rem; - --sk-page-content-width: 84rem; + --sk-page-content-width: 76rem; --sk-banner-bottom-height: 0px; --sk-pane-controls-height: 4.2rem; From f0f05584d04195edff0742158c0cd80b35496527 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 24 Oct 2024 22:52:34 -0400 Subject: [PATCH 2/5] bump up font size, paragraph margins --- packages/site-kit/src/lib/styles/base.css | 2 +- packages/site-kit/src/lib/styles/tokens.css | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/site-kit/src/lib/styles/base.css b/packages/site-kit/src/lib/styles/base.css index c74e8eb36f..602a81e90d 100644 --- a/packages/site-kit/src/lib/styles/base.css +++ b/packages/site-kit/src/lib/styles/base.css @@ -45,7 +45,7 @@ p, ul, ol { font: var(--sk-font-body); - margin: 1em 0; + margin: 1lh 0; &:first-child { margin-top: 0; diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 9ab43d1b33..881bcaa032 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -122,8 +122,8 @@ @media (resolution: 2x) { --sk-font-family-body: 'EB Garamond', Georgia, serif; - --sk-font-size-body: 2.1rem; - --sk-font-size-body-small: 1.8rem; + --sk-font-size-body: 2.3rem; + --sk-font-size-body-small: 2rem; --sk-line-height-body: 1.5; --sk-text-1: hsl(0, 0%, 5%); --sk-text-2: hsl(0, 0%, 12%); From 12f48cb45f5e0437a19dce234ed24bd0b4bb5f9c Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 24 Oct 2024 22:58:29 -0400 Subject: [PATCH 3/5] related tweaks --- .../src/routes/_home/Community.svelte | 10 ++++++-- .../src/routes/_home/Testimonials.svelte | 24 ++++++------------- 2 files changed, 15 insertions(+), 19 deletions(-) diff --git a/apps/svelte.dev/src/routes/_home/Community.svelte b/apps/svelte.dev/src/routes/_home/Community.svelte index 0ea3bcb0a2..eb03d6070d 100644 --- a/apps/svelte.dev/src/routes/_home/Community.svelte +++ b/apps/svelte.dev/src/routes/_home/Community.svelte @@ -6,9 +6,9 @@

join our friendly community

Our sister organisation, Svelte Society, organises - events around the globe. + events around the globe. Find your chapter and join us in + our Discord server.

-

Find your chapter and join us in our Discord server.

diff --git a/apps/svelte.dev/src/routes/_home/Testimonials.svelte b/apps/svelte.dev/src/routes/_home/Testimonials.svelte index 902b4b6c25..f76bf717e1 100644 --- a/apps/svelte.dev/src/routes/_home/Testimonials.svelte +++ b/apps/svelte.dev/src/routes/_home/Testimonials.svelte @@ -188,8 +188,12 @@ width: auto; } - .adjective::after { - content: 'adjective'; + .adjective { + margin-right: 0.5rem; + + &::after { + content: 'adjective'; + } } } } @@ -211,22 +215,8 @@ } @media (min-width: 1140px) { - .outer { - grid-template-areas: - 'definition screenshots' - 'blurb screenshots'; - } - - .definition { - grid-area: definition; - } - - .blurb { - grid-area: blurb; - } - .screenshots { - grid-area: screenshots; + top: -7em; } } From 3abff3cdfb892483e167406dbbcf0dfa1cf7044a Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 25 Oct 2024 07:53:36 -0400 Subject: [PATCH 4/5] bump sizes for low res screens --- packages/site-kit/src/lib/styles/tokens.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 881bcaa032..9402297529 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -32,8 +32,8 @@ --sk-font-size-h1: 3.6rem; --sk-font-size-h2: 3rem; --sk-font-size-h3: 2.4rem; - --sk-font-size-body: 1.8rem; - --sk-font-size-body-small: 1.6rem; + --sk-font-size-body: 2rem; + --sk-font-size-body-small: 1.8rem; --sk-font-size-ui-small: 1.3rem; --sk-font-size-ui-medium: 1.6rem; --sk-font-size-ui-large: 3rem; @@ -122,7 +122,7 @@ @media (resolution: 2x) { --sk-font-family-body: 'EB Garamond', Georgia, serif; - --sk-font-size-body: 2.3rem; + --sk-font-size-body: 2.2rem; --sk-font-size-body-small: 2rem; --sk-line-height-body: 1.5; --sk-text-1: hsl(0, 0%, 5%); From ca94226a6614d8c6028846a9cb49ebbb6f4a1fd9 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 25 Oct 2024 07:55:33 -0400 Subject: [PATCH 5/5] use same text colours on low and hi res screens --- packages/site-kit/src/lib/styles/tokens.css | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 9402297529..1ba8c455f6 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -65,9 +65,9 @@ --sk-back-5: hsl(0, 0%, 92%); --sk-back-6: hsl(0, 0%, 86%); - --sk-text-1: hsl(0, 0%, 12%); - --sk-text-2: hsl(0, 0%, 20%); - --sk-text-3: hsl(0, 0%, 30%); + --sk-text-1: hsl(0, 0%, 5%); + --sk-text-2: hsl(0, 0%, 12%); + --sk-text-3: hsl(0, 0%, 27%); --sk-text-4: hsl(0, 0%, 45%); --sk-scrollbar: rgba(0, 0, 0, 0.3); --sk-shadow: drop-shadow(0px 0px 14px rgba(0, 0, 0, 0.1)); @@ -125,9 +125,6 @@ --sk-font-size-body: 2.2rem; --sk-font-size-body-small: 2rem; --sk-line-height-body: 1.5; - --sk-text-1: hsl(0, 0%, 5%); - --sk-text-2: hsl(0, 0%, 12%); - --sk-text-3: hsl(0, 0%, 27%); } &.dark {