zoriya/v10
1
0
Fork 0
mirror of https://github.com/zoriya/v10.git synced 2026-08-16 02:45:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(site): new home page, docs, and design system (#566)

Browse Source 
Co-authored-by: Darius Cepulis <dcepulis@mux.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Ronald Urbina
2026-03-06 16:19:27 -06:00
committed by GitHub
co-authored by Darius Cepulis Claude Opus 4.6
parent f2f9e6ddc3
commit 351a3e8bda
255 changed files with 3574 additions and 1532 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/src/components/docs/SidebarItem.astro
+26 -21
View File
@@ -1,6 +1,6 @@
---
import GithubSlugger from 'github-slugger';
import { ChevronDown } from 'lucide-react';
import DropdownIcon from '@/components/icons/dropdown-arrow.svg?react';
import type { Guide, Section, SupportedFramework } from '@/types/docs';
import { isSection } from '@/types/docs';
@@ -51,45 +51,50 @@ function getGroupRotate(depth: number) {
<details
id={slugger.slug(item.sidebarLabel)}
open={isActive || item.defaultOpen !== false}
class:list={[
getGroup(depth),
depth === 0 && 'my-4 first:mt-0',
]}
class:list={[getGroup(depth), depth === 0 && "my-4 first:mt-0"]}
>
<summary
class:list={[
'py-2 flex items-center gap-4 ',
'intent:text-dark-100 dark:intent:text-light-80 cursor-pointer',
(depth === 0 || depth === 1) && 'font-medium',
depth > 0 && 'border-l pl-4',
isActive ? 'text-dark-100 dark:text-light-100 border-dark-100' : 'border-light-40 dark:border-dark-40',
getGroupMargin(depth)
"flex items-center gap-4 py-2 text-faded-black dark:text-manila-light",
"cursor-pointer",
depth === 0 ? "font-display text-h4 uppercase" : "text-p3",
depth > 0 && "border-l pl-4",
isActive ? "border-orange" : "border-manila-75 dark:border-warm-gray",
getGroupMargin(depth),
]}
style={depth ? `margin-left: calc(var(--spacing) * ${(depth - 1) * 4})` : ``}
style={
depth ? `margin-left: calc(var(--spacing) * ${(depth - 1) * 4})` : ``
}
>
<span class="flex-1">{item.sidebarLabel}</span>
<ChevronDown size={12} className={getGroupRotate(depth)} />
<DropdownIcon width={"0.65rem"} className={getGroupRotate(depth)} />
</summary>
<div>
{item.contents.map((contentItem) => (
<Astro.self item={contentItem} framework={framework} docTitles={docTitles} depth={depth + 1} />
<Astro.self
item={contentItem}
framework={framework}
docTitles={docTitles}
depth={depth + 1}
/>
))}
</div>
</details>
) : (
<a
aria-current={isActive ? 'page' : undefined}
aria-current={isActive ? "page" : undefined}
class:list={[
'py-2 flex items-center gap-4 ',
'intent:text-dark-100 dark:intent:text-light-100 cursor-pointer',
depth === 0 && 'font-medium',
depth > 0 && 'border-l pl-4',
isActive ? 'text-dark-100 dark:text-light-100 border-current ' : 'border-light-40 dark:border-dark-40',
"flex items-center gap-4 py-2 text-p3 text-faded-black dark:text-manila-light",
"cursor-pointer",
depth === 0 && "font-bold",
depth > 0 && "border-l pl-4",
depth > 0 && isActive && "font-bold",
isActive ? "border-orange" : "border-manila-75 dark:border-warm-gray",
]}
style={`margin-left: calc(var(--spacing) * ${(depth - 1) * 4})`}
href={`/docs/framework/${framework}/${item.slug}`}
>
{item.devOnly ? '[Dev only] ' : ''}
{item.devOnly ? "[Dev only] " : ""}
{item.sidebarLabel || docTitles.get(item.slug) || item.slug}
</a>
)