DocsLayout() — ui Function Reference

Architecture documentation for the DocsLayout() function in layout.tsx from the ui codebase.

Function tsx ComponentRegistry Styles

Entity Profile

ComponentRegistry→ Styles→ DocsLayout() — ui Function Reference

Dependency Diagram

graph TD
  520d3ac4_8bfd_7756_c569_0a5ea6cb0b4a["DocsLayout()"]
  1026f42e_b07e_292d_8a41_f485256fe71e["layout.tsx"]
  520d3ac4_8bfd_7756_c569_0a5ea6cb0b4a -->|defined in| 1026f42e_b07e_292d_8a41_f485256fe71e
  style 520d3ac4_8bfd_7756_c569_0a5ea6cb0b4a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

deprecated/www/app/(app)/docs/layout.tsx lines 4–21

export default function DocsLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <div className="container-wrapper">
      <div className="container flex-1 items-start md:grid md:grid-cols-[220px_minmax(0,1fr)] md:gap-6 lg:grid-cols-[240px_minmax(0,1fr)] lg:gap-10">
        <aside className="border-grid fixed top-14 z-30 hidden h-[calc(100vh-3.5rem)] w-full shrink-0 border-r md:sticky md:block">
          <div className="no-scrollbar h-full overflow-auto py-6 pr-4 lg:py-8">
            <DocsNav config={docsConfig} />
          </div>
        </aside>
        {children}
      </div>
    </div>
  )
}