From 06762a09768522845b52af06e2535498ba3b6082 Mon Sep 17 00:00:00 2001 From: zhengqi zhang <770166635@qq.com> Date: Wed, 3 Jul 2024 14:41:14 +0800 Subject: [PATCH 1/2] Make the sidebar collapsible. --- src/components/Icons/Icons.astro | 31 ++++ src/components/Icons/Icons.ts | 155 +++++++++++++++++++ src/components/LeftSidebar/LeftSidebar.astro | 117 +++++++++----- 3 files changed, 265 insertions(+), 38 deletions(-) create mode 100644 src/components/Icons/Icons.astro create mode 100644 src/components/Icons/Icons.ts diff --git a/src/components/Icons/Icons.astro b/src/components/Icons/Icons.astro new file mode 100644 index 000000000..b63a42738 --- /dev/null +++ b/src/components/Icons/Icons.astro @@ -0,0 +1,31 @@ +--- +import { Icons } from "./Icons" +interface Props { + name: keyof typeof Icons + label?: string + color?: string + size?: string + class?: string +} +const { name, label, size = "1em", color } = Astro.props +const a11yAttrs = label ? ({ "aria-label": label } as const) : ({ "aria-hidden": "true" } as const) +--- + + + + diff --git a/src/components/Icons/Icons.ts b/src/components/Icons/Icons.ts new file mode 100644 index 000000000..4aed2474f --- /dev/null +++ b/src/components/Icons/Icons.ts @@ -0,0 +1,155 @@ +const BuiltInIcons = { + "up-caret": + '', + "down-caret": + '', + "right-caret": + '', + "right-arrow": + '', + "left-arrow": + '', + bars: '', + translate: + '', + pencil: + '', + pen: '', + document: + '', + "add-document": + '', + setting: + '', + external: + '', + moon: '', + sun: '', + laptop: + '', + "open-book": + '', + information: + '', + magnifier: + '', + "forward-slash": + '', + close: + '', + error: + '', + warning: + '', + "approve-check-circle": + '', + "approve-check": + '', + rocket: + '', + star: '', + puzzle: + '', + "list-format": + '', + random: + '', + comment: + '', + "comment-alt": + '', + heart: + '', + github: + '', + gitlab: + '', + bitbucket: + '', + codePen: + '', + farcaster: + '', + discord: + '', + gitter: + '', + twitter: + '', + "x.com": + '', + mastodon: + '', + codeberg: + '', + youtube: + '', + threads: + '', + linkedin: + '', + twitch: + '', + microsoftTeams: + '', + instagram: + '', + stackOverflow: + '', + telegram: + '', + rss: '', + facebook: + '', + email: + '', + reddit: + '', + patreon: + '', + signal: + '', + slack: + '', + matrix: + '', + hackerOne: + '', + openCollective: + '', + blueSky: + '', + discourse: + '', + zulip: + '', + astro: + '', + alpine: '', + pnpm: '', + biome: + '', + bun: '', + mdx: '', + apple: + '', + linux: + '', + homebrew: + '', + nix: '', + starlight: + '', + pkl: '', + node: '', + cloudflare: + '', + vercel: '', + netlify: + '', + deno: '', +} + +export const Icons = { + ...BuiltInIcons, +} diff --git a/src/components/LeftSidebar/LeftSidebar.astro b/src/components/LeftSidebar/LeftSidebar.astro index c81ccff34..b9a8c7c97 100644 --- a/src/components/LeftSidebar/LeftSidebar.astro +++ b/src/components/LeftSidebar/LeftSidebar.astro @@ -1,8 +1,7 @@ --- import { MENU, Frontmatter, getSidebar } from "../../config" import { localizePath } from "astro-i18next" -import { changeLanguage } from "i18next" -import i18next from "i18next" +import Icon from "../Icons/Icons.astro" export type Props = { currentPage: string @@ -26,6 +25,23 @@ const removeSlashes = function (url: string) { } const currentPageMatch = removeSlashes(currentPage.slice(1)) + +const processedSidebarSections = sidebarSections.map((section) => { + return { + ...section, + contents: section.contents.map((child) => { + const isCurrent = currentPageMatch === removeSlashes(localizePath(child.url)) + return { + ...child, + isCurrent: isCurrent, + open: + isCurrent || + (child.children && + child.children.some((subChild) => currentPageMatch === removeSlashes(localizePath(subChild.url)))), + } + }), + } +}) ---