From 7012235cdda87ece10957a28595ce847777ff580 Mon Sep 17 00:00:00 2001 From: Benjamin Date: Tue, 19 Aug 2025 23:15:49 +0200 Subject: [PATCH] No sidebar (#102) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * always hide the sidebar as it’s super weird for a blogpsot * put back buttons in header on mobile --- astro.config.mjs | 27 ------------------- src/components/starlight/PageFrame.astro | 13 +++++++++ src/content/config.ts | 3 --- .../posts/CSS/how-to-bump-the-specificity.mdx | 2 -- .../posts/Others/visual-regression-tests.mdx | 2 -- .../React/react-life-cycles-and-timings.mdx | 1 - .../typescript-dts-dos-and-donts.mdx | 2 -- .../docs/posts/Yarn/yarn-the-good-parts.mdx | 1 - 8 files changed, 13 insertions(+), 38 deletions(-) diff --git a/astro.config.mjs b/astro.config.mjs index 161780e..cdc777f 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -68,33 +68,6 @@ export default defineConfig({ PageFrame: "./src/components/starlight/PageFrame.astro", PageTitle: "./src/components/starlight/PageTitle.astro", }, - // Technically not required, but to avoid having the next/prev buttons at the bottom of other pages - sidebar: [ - { - label: "React", - autogenerate: { directory: "posts/React" }, - }, - { - label: "Dark mode", - autogenerate: { directory: "posts/Dark mode" }, - }, - { - label: "CSS", - autogenerate: { directory: "posts/CSS" }, - }, - { - label: "TypeScript", - autogenerate: { directory: "posts/TypeScript" }, - }, - { - label: "Yarn", - autogenerate: { directory: "posts/Yarn" }, - }, - { - label: "Others", - autogenerate: { directory: "posts/Others" }, - }, - ], }), // Starlight comes with its own sitemap, but it makes all private pages public (and in general all pages public) diff --git a/src/components/starlight/PageFrame.astro b/src/components/starlight/PageFrame.astro index 2ed98ce..1541051 100644 --- a/src/components/starlight/PageFrame.astro +++ b/src/components/starlight/PageFrame.astro @@ -1,6 +1,8 @@ --- import Default from "@astrojs/starlight/components/PageFrame.astro"; import Analytics from "@components/Analytics.astro"; + +Astro.locals.starlightRoute.hasSidebar = false; --- @@ -17,11 +19,22 @@ import Analytics from "@components/Analytics.astro"; .main-frame { max-width: 80ch; } + @media (min-width: 50rem) { .main-frame { margin-inline: auto; } } + + @media (max-width: 50rem) { + .title-wrapper + * { + order: 2; /* On mobile, put search at the end */ + } + } + .title-wrapper + * + * { + display: flex; /* On mobile, keep the buttons & theme in header */ + margin-left: auto; /* and put it on the right, instead of centered */ + } diff --git a/src/content/config.ts b/src/content/config.ts index 9873e94..38f5721 100644 --- a/src/content/config.ts +++ b/src/content/config.ts @@ -43,9 +43,6 @@ export const collections = { wip: z.literal(true), // Custom key to drive all the changes, better DX pagefind: z.literal(false), - sidebar: z.object({ - hidden: z.literal(true), - }), }) // Splash don’t need requirements diff --git a/src/content/docs/posts/CSS/how-to-bump-the-specificity.mdx b/src/content/docs/posts/CSS/how-to-bump-the-specificity.mdx index d62931c..e5a84a5 100644 --- a/src/content/docs/posts/CSS/how-to-bump-the-specificity.mdx +++ b/src/content/docs/posts/CSS/how-to-bump-the-specificity.mdx @@ -2,8 +2,6 @@ title: "CSS: How to bump the specificity" slug: "posts/drafts/36d86a88-acef-4a15-b0f5-94a78c34857c" tags: ["css", "tip"] -sidebar: - hidden: true pagefind: false wip: true --- diff --git a/src/content/docs/posts/Others/visual-regression-tests.mdx b/src/content/docs/posts/Others/visual-regression-tests.mdx index 1a4d8db..9639b49 100644 --- a/src/content/docs/posts/Others/visual-regression-tests.mdx +++ b/src/content/docs/posts/Others/visual-regression-tests.mdx @@ -1,8 +1,6 @@ --- title: "Visual Regression Tests" slug: "posts/drafts/6a3b9493-3f14-4598-8fae-ab8f0d03d882" -sidebar: - hidden: true pagefind: false wip: true --- diff --git a/src/content/docs/posts/React/react-life-cycles-and-timings.mdx b/src/content/docs/posts/React/react-life-cycles-and-timings.mdx index 68a05a2..22d1592 100644 --- a/src/content/docs/posts/React/react-life-cycles-and-timings.mdx +++ b/src/content/docs/posts/React/react-life-cycles-and-timings.mdx @@ -6,7 +6,6 @@ createdAt: 2024-11-07 lastUpdated: 2024-11-07 sidebar: order: 5 - hidden: true pagefind: false wip: true --- diff --git a/src/content/docs/posts/TypeScript/typescript-dts-dos-and-donts.mdx b/src/content/docs/posts/TypeScript/typescript-dts-dos-and-donts.mdx index 6ef3902..ae35da8 100644 --- a/src/content/docs/posts/TypeScript/typescript-dts-dos-and-donts.mdx +++ b/src/content/docs/posts/TypeScript/typescript-dts-dos-and-donts.mdx @@ -2,8 +2,6 @@ title: "TypeScript .d.ts: dos and don'ts" tags: ["typescript"] slug: "posts/drafts/3a523734-dad8-4013-96cd-5cf75e5688c7" -sidebar: - hidden: true pagefind: false wip: true --- diff --git a/src/content/docs/posts/Yarn/yarn-the-good-parts.mdx b/src/content/docs/posts/Yarn/yarn-the-good-parts.mdx index 9ce1e84..0edcebb 100644 --- a/src/content/docs/posts/Yarn/yarn-the-good-parts.mdx +++ b/src/content/docs/posts/Yarn/yarn-the-good-parts.mdx @@ -7,7 +7,6 @@ image: /src/assets/pkcen3s6x5403jl6usey.jpeg description: "TODO" sidebar: order: 3 - hidden: true pagefind: false wip: true --- -- 2.51.2