From a14f460db8c26aef76ffe879ab04d00b0ab3ec91 Mon Sep 17 00:00:00 2001 From: CobusT Date: Sat, 17 Aug 2024 21:15:23 -0700 Subject: [PATCH 01/12] branding changes --- docs/.vitepress/theme/custom.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index 2b5f70e8e9..d7a2fd8e05 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -1,3 +1,5 @@ +@import url('https://fonts.googleapis.com/css2?family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap'); + :root { --vp-c-purple-1: #7135be; --vp-c-purple-2: #7f42cd; @@ -10,6 +12,7 @@ --vp-c-purple-2: #9a5ae8; --vp-c-purple-3: #884ad6; --vp-c-purple-soft: rgba(155, 91, 233, 0.16); + --vp-c-text-1: #F5F5F5; } :root { @@ -24,6 +27,19 @@ --vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif; } +.vp-doc h1 { + font-family: "Spline-Sans Mono", monospace; + font-weight: medium; +} + +.vp-doc p { + font-weight: 500; +} + +:root.dark .vp-doc a { + color: var(--vp-c-text-1); +} + .vp-doc figcaption { line-height: 20px; font-size: 12px; From 66793e7d814e4a2861d637cbe028e19e545ca665 Mon Sep 17 00:00:00 2001 From: CobusT Date: Sat, 17 Aug 2024 21:31:50 -0700 Subject: [PATCH 02/12] removed 'Enterprise' link from footer --- docs/.vitepress/theme/CustomFooter.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/.vitepress/theme/CustomFooter.vue b/docs/.vitepress/theme/CustomFooter.vue index 6bda2ef804..e026f21983 100644 --- a/docs/.vitepress/theme/CustomFooter.vue +++ b/docs/.vitepress/theme/CustomFooter.vue @@ -25,7 +25,6 @@
  • Plot
  • Integrations
  • Pricing
    • -
  • Enterprise
    • From 478eb663c3986fffebf7d095514713281b553814 Mon Sep 17 00:00:00 2001 From: CobusT Date: Mon, 19 Aug 2024 15:13:20 -0700 Subject: [PATCH 03/12] css tweaks --- docs/.vitepress/theme/custom.css | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index d7a2fd8e05..5cf85b252e 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -1,4 +1,4 @@ -@import url('https://fonts.googleapis.com/css2?family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap'); +@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap"); :root { --vp-c-purple-1: #7135be; @@ -27,16 +27,17 @@ --vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif; } +.vp-doc { + font-family: "Inter", sans-serif; + font-weight: 500; +} .vp-doc h1 { font-family: "Spline-Sans Mono", monospace; - font-weight: medium; -} - -.vp-doc p { font-weight: 500; + margin-bottom: 8px; } -:root.dark .vp-doc a { +.vp-doc a { color: var(--vp-c-text-1); } From c3998121777d9d3d5fb684f714b880863f2acb59 Mon Sep 17 00:00:00 2001 From: CobusT Date: Mon, 19 Aug 2024 15:22:56 -0700 Subject: [PATCH 04/12] Fixed color of button text on main page. --- docs/.vitepress/theme/ObservablePromo.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/.vitepress/theme/ObservablePromo.vue b/docs/.vitepress/theme/ObservablePromo.vue index a877b5c931..e3b4b93082 100644 --- a/docs/.vitepress/theme/ObservablePromo.vue +++ b/docs/.vitepress/theme/ObservablePromo.vue @@ -70,7 +70,7 @@ a.button { font-weight: 600; white-space: nowrap; background-color: var(--vp-c-neutral); - color: var(--vp-c-neutral-inverse); + color: var(--vp-c-neutral-inverse) !important; border-radius: 20px; padding: 0 20px; line-height: 38px; From 071e9a19df5a8b2b08588cbaf397aa27595e0819 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= Date: Tue, 20 Aug 2024 08:57:52 +0200 Subject: [PATCH 05/12] Use Vitepress headers for faster font loading See https://vitepress.dev/reference/site-config#example-adding-google-fonts MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Note that we're using the (slightly faster?) "preload as stylesheet" strategy —as we do in Framework— over "preconnect" that Vitepress suggests. --- docs/.vitepress/config.ts | 3 +++ docs/.vitepress/theme/custom.css | 2 -- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index 2271044fca..7a8b9e91f8 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -25,6 +25,9 @@ export default defineConfig({ } }, head: [ + ["link", {rel: "preconnect", href: "https://fonts.gstatic.com", crossorigin: ""}], + ["link", {rel: "preload", as: "style", href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap"}], + ["link", {rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap"}], ["link", {rel: "apple-touch-icon", href: "https://static.observablehq.com/favicon-512.0667824687f99c942a02e06e2db1a060911da0bf3606671676a255b1cf97b4fe.png"}], ["link", {rel: "icon", type: "image/png", href: "https://static.observablehq.com/favicon-512.0667824687f99c942a02e06e2db1a060911da0bf3606671676a255b1cf97b4fe.png", sizes: "512x512"}], ["script", {async: "", src: "https://www.googletagmanager.com/gtag/js?id=G-9B88TP6PKQ"}], diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index 5cf85b252e..2b6fb755cc 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -1,5 +1,3 @@ -@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Spline+Sans+Mono:ital,wght@0,300..700;1,300..700&display=swap"); - :root { --vp-c-purple-1: #7135be; --vp-c-purple-2: #7f42cd; From c43d1ca6900061d59d3b3f1ba9744e5fb5ce3a84 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= Date: Tue, 20 Aug 2024 08:58:08 +0200 Subject: [PATCH 06/12] normalize hex color to lowercase --- docs/.vitepress/theme/custom.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index 2b6fb755cc..edd28f9763 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -10,7 +10,7 @@ --vp-c-purple-2: #9a5ae8; --vp-c-purple-3: #884ad6; --vp-c-purple-soft: rgba(155, 91, 233, 0.16); - --vp-c-text-1: #F5F5F5; + --vp-c-text-1: #f5f5f5; } :root { From fea650567cc4b76bf1384f869e2157fa7f73981a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= Date: Tue, 20 Aug 2024 08:59:31 +0200 Subject: [PATCH 07/12] scope a.button to .promo, to remove an !important (a.button is not used anywhere else; introduced in #1757) --- docs/.vitepress/theme/ObservablePromo.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/.vitepress/theme/ObservablePromo.vue b/docs/.vitepress/theme/ObservablePromo.vue index e3b4b93082..1ca79f42f8 100644 --- a/docs/.vitepress/theme/ObservablePromo.vue +++ b/docs/.vitepress/theme/ObservablePromo.vue @@ -62,7 +62,7 @@ h1 { opacity: 0.7; } -a.button { +.promo a.button { display: inline-block; border: 1px solid transparent; text-align: center; @@ -70,7 +70,7 @@ a.button { font-weight: 600; white-space: nowrap; background-color: var(--vp-c-neutral); - color: var(--vp-c-neutral-inverse) !important; + color: var(--vp-c-neutral-inverse); border-radius: 20px; padding: 0 20px; line-height: 38px; From 51b4cbda28a4f95c6604659d1d442d116bbd118d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= Date: Tue, 20 Aug 2024 12:51:02 +0200 Subject: [PATCH 08/12] base --- docs/.vitepress/theme/custom.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index edd28f9763..e54ad62c30 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -22,13 +22,14 @@ --vp-c-brand-2: var(--vp-c-purple-2); --vp-c-brand-3: var(--vp-c-purple-3); --vp-c-brand-soft: var(--vp-c-purple-soft); - --vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif; + --vp-font-family-base: Inter, -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", + ubuntu, roboto, noto, "segoe ui", arial, sans-serif; } .vp-doc { - font-family: "Inter", sans-serif; font-weight: 500; } + .vp-doc h1 { font-family: "Spline-Sans Mono", monospace; font-weight: 500; From 3188d48cdb0f65fdadb951260afe5341c74b88d6 Mon Sep 17 00:00:00 2001 From: CobusT Date: Tue, 20 Aug 2024 07:44:46 -0700 Subject: [PATCH 09/12] fixed h1 heading font and removed h1 margin --- docs/.vitepress/theme/custom.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index e54ad62c30..e494cce16c 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -24,6 +24,7 @@ --vp-c-brand-soft: var(--vp-c-purple-soft); --vp-font-family-base: Inter, -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif; + --vp-font-family-brand-heading: "Spline Sans Mono", monospace; } .vp-doc { @@ -31,9 +32,8 @@ } .vp-doc h1 { - font-family: "Spline-Sans Mono", monospace; + font-family: var(--vp-font-family-brand-heading); font-weight: 500; - margin-bottom: 8px; } .vp-doc a { From 4bf2930a60d76a608286a40b6485c48044ae37cf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= Date: Tue, 20 Aug 2024 16:54:55 +0200 Subject: [PATCH 10/12] revert the change to vp-font-family-base --- docs/.vitepress/theme/custom.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index e494cce16c..19fe6888dd 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -22,12 +22,13 @@ --vp-c-brand-2: var(--vp-c-purple-2); --vp-c-brand-3: var(--vp-c-purple-3); --vp-c-brand-soft: var(--vp-c-purple-soft); - --vp-font-family-base: Inter, -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", - ubuntu, roboto, noto, "segoe ui", arial, sans-serif; + --vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, + roboto, noto, "segoe ui", arial, sans-serif; --vp-font-family-brand-heading: "Spline Sans Mono", monospace; } .vp-doc { + font-family: Inter, var(--vp-font-family-base); font-weight: 500; } From 4b0cc91bf51a5614102c2bafff0c9f85cf2dda0d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= Date: Tue, 20 Aug 2024 17:09:53 +0200 Subject: [PATCH 11/12] rename base classes --- docs/.vitepress/theme/custom.css | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index 19fe6888dd..f056b843fc 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -24,16 +24,17 @@ --vp-c-brand-soft: var(--vp-c-purple-soft); --vp-font-family-base: -apple-system, BlinkMacSystemFont, "avenir next", avenir, helvetica, "helvetica neue", ubuntu, roboto, noto, "segoe ui", arial, sans-serif; - --vp-font-family-brand-heading: "Spline Sans Mono", monospace; + --sans-text: Inter, var(--vp-font-family-base); + --mono-heading: "Spline Sans Mono", monospace; } .vp-doc { - font-family: Inter, var(--vp-font-family-base); + font-family: var(--sans-text); font-weight: 500; } .vp-doc h1 { - font-family: var(--vp-font-family-brand-heading); + font-family: var(--mono-heading); font-weight: 500; } From 101be38b15fbddcff20bbd80a54d73ab0f9558ab Mon Sep 17 00:00:00 2001 From: CobusT Date: Tue, 20 Aug 2024 08:12:34 -0700 Subject: [PATCH 12/12] merged 2 root sections of css --- docs/.vitepress/theme/custom.css | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/docs/.vitepress/theme/custom.css b/docs/.vitepress/theme/custom.css index f056b843fc..233d2603aa 100644 --- a/docs/.vitepress/theme/custom.css +++ b/docs/.vitepress/theme/custom.css @@ -3,17 +3,6 @@ --vp-c-purple-2: #7f42cd; --vp-c-purple-3: #9555e2; --vp-c-purple-soft: rgba(155, 91, 233, 0.14); -} - -.dark { - --vp-c-purple-1: #db96ff; - --vp-c-purple-2: #9a5ae8; - --vp-c-purple-3: #884ad6; - --vp-c-purple-soft: rgba(155, 91, 233, 0.16); - --vp-c-text-1: #f5f5f5; -} - -:root { --vp-c-red: #f43f5e; --vp-c-green: #10b981; --vp-c-blue: #0092ff; @@ -28,6 +17,14 @@ --mono-heading: "Spline Sans Mono", monospace; } +.dark { + --vp-c-purple-1: #db96ff; + --vp-c-purple-2: #9a5ae8; + --vp-c-purple-3: #884ad6; + --vp-c-purple-soft: rgba(155, 91, 233, 0.16); + --vp-c-text-1: #f5f5f5; +} + .vp-doc { font-family: var(--sans-text); font-weight: 500;