diff --git a/docs/src/assets/showcase/developers.cloudflare.com.png b/docs/src/assets/showcase/developers.cloudflare.com.png new file mode 100644 index 00000000000..f3150109713 Binary files /dev/null and b/docs/src/assets/showcase/developers.cloudflare.com.png differ diff --git a/docs/src/components/showcase-sites.astro b/docs/src/components/showcase-sites.astro index 74c7848caca..3ceb6d6cd39 100644 --- a/docs/src/components/showcase-sites.astro +++ b/docs/src/components/showcase-sites.astro @@ -163,4 +163,9 @@ import FluidGrid from './fluid-grid.astro'; href="https://pokemon-siace.netlify.app/" thumbnail="pokemon-siace.netlify.app.png" /> + diff --git a/docs/src/content/docs/fr/guides/customization.mdx b/docs/src/content/docs/fr/guides/customization.mdx index f475d41bcc8..1396a2d010d 100644 --- a/docs/src/content/docs/fr/guides/customization.mdx +++ b/docs/src/content/docs/fr/guides/customization.mdx @@ -385,7 +385,7 @@ Il fournit des modules npm que vous pouvez installer pour les polices que vous s 2. Installez le package pour la police choisie. Vous pouvez trouver le nom du package en cliquant sur "Installer" sur la page de police Fontsource. - + diff --git a/docs/src/content/docs/fr/guides/site-search.mdx b/docs/src/content/docs/fr/guides/site-search.mdx index 54d171cd60a..70f42731b86 100644 --- a/docs/src/content/docs/fr/guides/site-search.mdx +++ b/docs/src/content/docs/fr/guides/site-search.mdx @@ -52,7 +52,7 @@ Si vous avez accès au [programme DocSearch d'Algolia](https://docsearch.algolia 1. Installez `@astrojs/starlight-docsearch` : - + diff --git a/docs/src/content/docs/fr/manual-setup.mdx b/docs/src/content/docs/fr/manual-setup.mdx index 06c334e0553..1769109602f 100644 --- a/docs/src/content/docs/fr/manual-setup.mdx +++ b/docs/src/content/docs/fr/manual-setup.mdx @@ -16,7 +16,7 @@ Pour suivre ce guide, vous aurez besoin d'un projet Astro existant. Starlight est une [intégration Astro](https://docs.astro.build/fr/guides/integrations-guide/). Ajoutez-la à votre site en exécutant la commande `astro add` dans le répertoire racine de votre projet : - + ```sh npx astro add starlight diff --git a/docs/src/content/docs/ko/guides/components.mdx b/docs/src/content/docs/ko/guides/components.mdx index 631bd58363b..f4f5479f3f0 100644 --- a/docs/src/content/docs/ko/guides/components.mdx +++ b/docs/src/content/docs/ko/guides/components.mdx @@ -91,7 +91,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'; `syncKey` 속성을 추가하여 여러 탭 그룹을 동기화된 상태로 유지합니다. -동일한 `syncKey` 값을 가진 페이지의 모든 ``에는 동일한 활성 라벨이 표시됩니다. 이를 통해 독자는 한 번 (예: 운영 체제 또는 패키지 관리자) 선택하고 선택 사항이 페이지 전체에 반영되는 것을 볼 수 있습니다. +`syncKey` 값이 같은 모든 ``는 동일한 활성 라벨을 표시합니다. 이렇게 하면 독자가 운영 체제나 패키지 관리자 등을 한 번 선택하면 페이지 탐색 간 선택한 내용이 유지되는 것을 확인할 수 있습니다. 관련 탭을 동기화하려면 각 `` 컴포넌트에 동일한 `syncKey` 속성을 추가하고 모두 동일한 `` 라벨을 사용하는지 확인하세요. @@ -229,6 +229,38 @@ import { LinkCard } from '@astrojs/starlight/components'; +### 링크 버튼 + +시각적으로 구분되는 콜투액션 링크에는 `` 컴포넌트를 사용합니다. +링크 버튼은 가장 관련성이 높거나 실행 가능한 콘텐츠로 사용자를 안내하는 데 유용하며 랜딩 페이지에서 자주 사용됩니다 + +``에는 [`href`](https://developer.mozilla.org/ko/docs/Web/HTML/Element/a#href) 속성이 필요하며, 'target'과 같은 다른 링크 속성을 선택적으로 허용합니다. + +`icon` 속성을 [Starlight 내장 아이콘 중 하나](#모든-아이콘)의 이름으로 설정하여 텍스트 옆에 아이콘을 포함할 수 있습니다. +텍스트 앞에 아이콘을 배치하기 위해 `iconPlacement` 속성을 `start`로 설정할 수 있습니다 (기본값은 `end`). + +`primary` (기본값), `secondary`, `minimal`로 설정할 수 있는 `variant` 속성을 사용하여 링크 버튼의 모양을 사용자 정의합니다. + +```mdx +# src/content/docs/example.mdx + +import { LinkButton } from '@astrojs/starlight/components'; + +시작하기 + + 관련: Astro + +``` + +위의 코드는 페이지에 다음과 같은 내용을 생성합니다: + +import { LinkButton } from '@astrojs/starlight/components'; + +시작하기 + + 관련: Astro + + ### 주석 “권고” 또는 “콜아웃”이라고도 하는 '주석'은 페이지의 기본 콘텐츠 옆에 보조 정보를 표시하는 데 유용합니다. diff --git a/docs/src/content/docs/ko/guides/customization.mdx b/docs/src/content/docs/ko/guides/customization.mdx index 8c3b2ceaf0a..9cddb9ff09a 100644 --- a/docs/src/content/docs/ko/guides/customization.mdx +++ b/docs/src/content/docs/ko/guides/customization.mdx @@ -370,7 +370,7 @@ Starlight 사이트에 사용자 정의 글꼴을 추가해야 하는 경우, 2. 선택한 글꼴에 대한 패키지를 설치합니다. Fontsource 글꼴 페이지에서 “Install”을 클릭하면 패키지 이름을 찾을 수 있습니다. - + diff --git a/docs/src/content/docs/ko/guides/pages.mdx b/docs/src/content/docs/ko/guides/pages.mdx index 77f0cb16ea0..f13583d34d0 100644 --- a/docs/src/content/docs/ko/guides/pages.mdx +++ b/docs/src/content/docs/ko/guides/pages.mdx @@ -109,26 +109,25 @@ Markdown 페이지의 프론트매터와 유사하게 이 페이지에 대한 [ ##### `sidebar` -**타입:** `SidebarEntry[]` +**타입:** [`SidebarItem[]`](/ko/reference/configuration/#sidebaritem) **기본값:** [전역 `sidebar` 구성](/ko/reference/configuration/#sidebar)을 기반으로 생성된 사이드바 이 페이지에 대한 사용자 정의 사이트 탐색 사이드바를 제공합니다. 설정하지 않으면 페이지에서 기본 전역 사이드바를 사용합니다. -예를 들어, 다음 페이지는 홈페이지 링크와 다양한 별자리에 대한 링크 그룹으로 기본 사이드바를 재정의합니다. -사이드바의 현재 페이지는 `isCurrent` 속성을 사용하여 설정되었으며 선택적인 `badge`가 링크 항목에 추가되었습니다. +예를 들어, 다음 페이지는 홈페이지 링크와 다양한 다른 사용자 지정 페이지로 연결되는 링크 그룹으로 기본 사이드바를 재정의합니다. ```astro {3-13} ``` +사이드바를 사용자 정의하기 위해 사용할 수 있는 옵션에 대해 자세히 알아보려면 [“사이드바 탐색”](/ko/guides/sidebar/) 가이드를 참조하세요. + ##### `hasSidebar` -**타입:** `boolean` +**타입:** `boolean` **기본값:** [`frontmatter.template`](/ko/reference/frontmatter/#template)의 값이 `'splash'`라면 `false`, 그렇지 않다면 `true` 이 페이지에 사이드바를 표시할지 여부를 제어합니다. ##### `headings` -**타입:** `{ depth: number; slug: string; text: string }[]` +**타입:** `{ depth: number; slug: string; text: string }[]` **기본값:** `[]` 이 페이지의 모든 제목 배열을 제공하세요. @@ -154,21 +155,21 @@ Markdown 페이지의 프론트매터와 유사하게 이 페이지에 대한 [ ##### `dir` -**타입:** `'ltr' | 'rtl'` +**타입:** `'ltr' | 'rtl'` **기본값:** 현재 로케일의 쓰기 방향 이 페이지 콘텐츠의 쓰기 방향을 설정합니다. ##### `lang` -**타입:** `string` +**타입:** `string` **기본값:** 현재 로케일의 언어 이 페이지 콘텐츠에 대해 BCP-47 언어 태그를 설정합니다. 예: `en`, `zh-CN` 또는 `pt-BR`. ##### `isFallback` -**타입:** `boolean` +**타입:** `boolean` **기본값:** `false` 현재 언어에 대한 번역이 존재하지 않아 이 페이지가 [대체 콘텐츠](/ko/guides/i18n/#대체-콘텐츠)를 사용하고 있는지 표시합니다. diff --git a/docs/src/content/docs/ko/guides/site-search.mdx b/docs/src/content/docs/ko/guides/site-search.mdx index 4e8dfd85e7e..cbdae255855 100644 --- a/docs/src/content/docs/ko/guides/site-search.mdx +++ b/docs/src/content/docs/ko/guides/site-search.mdx @@ -52,7 +52,7 @@ title: 부분적으로 색인이 생성된 페이지 1. `@astrojs/starlight-docsearch`를 설치합니다. - + diff --git a/docs/src/content/docs/ko/index.mdx b/docs/src/content/docs/ko/index.mdx index edcdc43d0f3..baa0bdf1e1d 100644 --- a/docs/src/content/docs/ko/index.mdx +++ b/docs/src/content/docs/ko/index.mdx @@ -15,10 +15,10 @@ hero: actions: - text: 시작하기 icon: right-arrow - variant: primary link: /ko/getting-started/ - text: GitHub에서 보기 icon: external + variant: minimal link: https://github.com/withastro/starlight --- @@ -67,8 +67,9 @@ import Testimonial from '~/components/testimonial.astro'; cite="https://twitter.com/sulco/status/1735610348730802342" > Starlight는 훌륭한 DX의 대표적인 예시입니다. 속도, 편리함, 세부 사항에 대한 관심이 인상적입니다. 기술과 디자인을 모두 관리하므로 콘텐츠에 집중할 수 있습니다 👏 - + StackBlitz 팀은 이 프로젝트를 정말 좋아합니다! + + ```sh npx astro add starlight diff --git a/docs/src/content/docs/ko/reference/frontmatter.md b/docs/src/content/docs/ko/reference/frontmatter.md index 0721c35117e..97c32acdd87 100644 --- a/docs/src/content/docs/ko/reference/frontmatter.md +++ b/docs/src/content/docs/ko/reference/frontmatter.md @@ -113,10 +113,10 @@ hero: - text: 더보기 link: /getting-started/ icon: right-arrow - variant: primary - text: Github에서 보기 link: https://github.com/astronaut/my-project icon: external + variant: minimal attrs: rel: me --- @@ -164,8 +164,8 @@ interface HeroConfig { actions?: Array<{ text: string; link: string; - variant: 'primary' | 'secondary' | 'minimal'; - icon: string; + variant?: 'primary' | 'secondary' | 'minimal'; + icon?: string; attrs?: Record; }>; } diff --git a/examples/basics/package.json b/examples/basics/package.json index fc505fbd5a7..b680595d702 100644 --- a/examples/basics/package.json +++ b/examples/basics/package.json @@ -11,7 +11,7 @@ "astro": "astro" }, "dependencies": { - "@astrojs/starlight": "^0.26.0", + "@astrojs/starlight": "^0.26.1", "astro": "^4.10.2", "sharp": "^0.32.5" } diff --git a/examples/tailwind/package.json b/examples/tailwind/package.json index f513e16cf9f..8a0f542af08 100644 --- a/examples/tailwind/package.json +++ b/examples/tailwind/package.json @@ -11,7 +11,7 @@ "astro": "astro" }, "dependencies": { - "@astrojs/starlight": "^0.26.0", + "@astrojs/starlight": "^0.26.1", "@astrojs/starlight-tailwind": "^2.0.3", "@astrojs/tailwind": "^5.1.0", "astro": "^4.10.2", diff --git a/packages/starlight/CHANGELOG.md b/packages/starlight/CHANGELOG.md index 452efc4ffcf..5b48ed952f8 100644 --- a/packages/starlight/CHANGELOG.md +++ b/packages/starlight/CHANGELOG.md @@ -1,5 +1,11 @@ # @astrojs/starlight +## 0.26.1 + +### Patch Changes + +- [#2219](https://github.com/withastro/starlight/pull/2219) [`74d4716`](https://github.com/withastro/starlight/commit/74d4716f6a70fbef486e1057b81d2280c40251df) Thanks [@HiDeoo](https://github.com/HiDeoo)! - Fixes a sidebar persistence issue when navigating between pages with different sidebar content. + ## 0.26.0 ### Minor Changes diff --git a/packages/starlight/components/SidebarPersistState.ts b/packages/starlight/components/SidebarPersistState.ts index 4288fa41c75..029dd95cf35 100644 --- a/packages/starlight/components/SidebarPersistState.ts +++ b/packages/starlight/components/SidebarPersistState.ts @@ -16,17 +16,19 @@ interface SidebarState { /** * Get the current sidebar state. * - * The `open` state is loaded from session storage, while `scroll` and `hash` are read from the current page. + * The `open` state is loaded from session storage when the sidebar hashes match, while `scroll` + * and `hash` are read from the current page. */ const getState = (): SidebarState => { let open = []; + const hash = target?.dataset.hash || ''; try { const rawStoredState = sessionStorage.getItem(storageKey); const storedState = JSON.parse(rawStoredState || '{}'); - if (Array.isArray(storedState.open)) open = storedState.open; + if (Array.isArray(storedState.open) && storedState.hash === hash) open = storedState.open; } catch {} return { - hash: target?.dataset.hash || '', + hash, open, scroll: scroller?.scrollTop || 0, }; diff --git a/packages/starlight/package.json b/packages/starlight/package.json index a76a3857c31..52c8097711e 100644 --- a/packages/starlight/package.json +++ b/packages/starlight/package.json @@ -1,6 +1,6 @@ { "name": "@astrojs/starlight", - "version": "0.26.0", + "version": "0.26.1", "description": "Build beautiful, high-performance documentation websites with Astro", "scripts": { "test": "vitest", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1b8a4e881ef..840edd0467a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -73,7 +73,7 @@ importers: examples/basics: dependencies: '@astrojs/starlight': - specifier: ^0.26.0 + specifier: ^0.26.1 version: link:../../packages/starlight astro: specifier: ^4.10.2 @@ -85,7 +85,7 @@ importers: examples/tailwind: dependencies: '@astrojs/starlight': - specifier: ^0.26.0 + specifier: ^0.26.1 version: link:../../packages/starlight '@astrojs/starlight-tailwind': specifier: ^2.0.3