From 705fa86b4ed7569a622b88b3b364cb6a172edcd3 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Tue, 29 Oct 2024 12:02:36 +0100 Subject: [PATCH 1/4] chore: tweak dark mode backgrounds - make the darkest one a bit lighter (else it's just too dark) - turn down saturation to give the whole thing a bit of a warmer feeling (the blue makes it overly cold) --- packages/site-kit/src/lib/styles/tokens.css | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 4cb3c8cbf2..38759d7d13 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -143,12 +143,12 @@ --sk-back-hue: 220; - --sk-back-1: hsl(var(--sk-back-hue), 15%, 8%); - --sk-back-2: hsl(var(--sk-back-hue), 15%, 15%); - --sk-back-3: hsl(var(--sk-back-hue), 15%, 12%); - --sk-back-4: hsl(var(--sk-back-hue), 15%, 22%); - --sk-back-5: hsl(var(--sk-back-hue), 15%, 25%); - --sk-back-6: hsl(var(--sk-back-hue), 15%, 32%); + --sk-back-1: hsl(var(--sk-back-hue), 5%, 10%); + --sk-back-2: hsl(var(--sk-back-hue), 5%, 15%); + --sk-back-3: hsl(var(--sk-back-hue), 5%, 12%); + --sk-back-4: hsl(var(--sk-back-hue), 5%, 22%); + --sk-back-5: hsl(var(--sk-back-hue), 5%, 25%); + --sk-back-6: hsl(var(--sk-back-hue), 5%, 32%); --sk-back-translucent: hsla(0, 0%, 100%, 0.1); --sk-theme-1-hsl: 12, 94%, 62%; --sk-text-1: hsl(var(--sk-back-hue), 10%, 90%); From ae31240199b4c69bfe1a44c58be30732db2bec93 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Tue, 29 Oct 2024 12:20:02 +0100 Subject: [PATCH 2/4] tone down text blue-ness aswell --- packages/site-kit/src/lib/styles/tokens.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 38759d7d13..985f5f4fc3 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -151,10 +151,10 @@ --sk-back-6: hsl(var(--sk-back-hue), 5%, 32%); --sk-back-translucent: hsla(0, 0%, 100%, 0.1); --sk-theme-1-hsl: 12, 94%, 62%; - --sk-text-1: hsl(var(--sk-back-hue), 10%, 90%); - --sk-text-2: hsl(var(--sk-back-hue), 10%, 80%); - --sk-text-3: hsl(var(--sk-back-hue), 10%, 65%); - --sk-text-4: hsl(var(--sk-back-hue), 10%, 45%); + --sk-text-1: hsl(var(--sk-back-hue), 5%, 90%); + --sk-text-2: hsl(var(--sk-back-hue), 5%, 80%); + --sk-text-3: hsl(var(--sk-back-hue), 5%, 65%); + --sk-text-4: hsl(var(--sk-back-hue), 5%, 45%); --sk-text-translucent: hsla(0, 0%, 100%, 0.9); --sk-scrollbar: rgba(255, 255, 255, 0.3); --sk-shadow: drop-shadow(1px 2px 16px rgba(0, 0, 0, 0.5)); From 5357a83abf8a247c11dd74782f5e9793f3fd0bdb Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Tue, 29 Oct 2024 12:37:46 +0100 Subject: [PATCH 3/4] remove blueness from text colors, makes them brighter yet still pleasing to the eyes --- packages/site-kit/src/lib/styles/tokens.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/site-kit/src/lib/styles/tokens.css b/packages/site-kit/src/lib/styles/tokens.css index 985f5f4fc3..36ca32bdc1 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -151,10 +151,10 @@ --sk-back-6: hsl(var(--sk-back-hue), 5%, 32%); --sk-back-translucent: hsla(0, 0%, 100%, 0.1); --sk-theme-1-hsl: 12, 94%, 62%; - --sk-text-1: hsl(var(--sk-back-hue), 5%, 90%); - --sk-text-2: hsl(var(--sk-back-hue), 5%, 80%); - --sk-text-3: hsl(var(--sk-back-hue), 5%, 65%); - --sk-text-4: hsl(var(--sk-back-hue), 5%, 45%); + --sk-text-1: hsl(0, 0%, 90%); + --sk-text-2: hsl(0, 0%, 80%); + --sk-text-3: hsl(0, 0%, 65%); + --sk-text-4: hsl(0, 0%, 45%); --sk-text-translucent: hsla(0, 0%, 100%, 0.9); --sk-scrollbar: rgba(255, 255, 255, 0.3); --sk-shadow: drop-shadow(1px 2px 16px rgba(0, 0, 0, 0.5)); From 43458b75f584f3b2982e5d9f62aa87e3c85bd7a3 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Tue, 29 Oct 2024 21:45:27 +0100 Subject: [PATCH 4/4] text a tiny bit lighter --- 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 36ca32bdc1..dc39608249 100644 --- a/packages/site-kit/src/lib/styles/tokens.css +++ b/packages/site-kit/src/lib/styles/tokens.css @@ -152,9 +152,9 @@ --sk-back-translucent: hsla(0, 0%, 100%, 0.1); --sk-theme-1-hsl: 12, 94%, 62%; --sk-text-1: hsl(0, 0%, 90%); - --sk-text-2: hsl(0, 0%, 80%); - --sk-text-3: hsl(0, 0%, 65%); - --sk-text-4: hsl(0, 0%, 45%); + --sk-text-2: hsl(0, 0%, 84%); + --sk-text-3: hsl(0, 0%, 67%); + --sk-text-4: hsl(0, 0%, 47%); --sk-text-translucent: hsla(0, 0%, 100%, 0.9); --sk-scrollbar: rgba(255, 255, 255, 0.3); --sk-shadow: drop-shadow(1px 2px 16px rgba(0, 0, 0, 0.5));