Something went wrong. Try again.
This repository has no description
Something went wrong. Try again.
2.1 kB · 67 lines
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768import type { OctaneNode } from "octane";import { CloudflareLogo } from "octane-kumo/components/cloudflare-logo";import { ThemeToggle } from "../../src/components/theme-toggle";
export function ControlPlaneLayout({ title, description, page, children,}: { title: string; description: string; page?: string; children: OctaneNode;}) { const overview = page ? "/connect" : ""; return ( <div className="onboarding"> <a className="skip-link" href="#main-content"> Skip to content </a> <header className="control-header"> <a className="control-brand" href="/connect"> <CloudflareLogo variant="glyph" className="control-brand-mark" /> <span>Flarebot</span> </a> <span className="control-header-label">Installation management</span> <div className="control-header-actions"> <ThemeToggle /> </div> </header> <div className="control-layout"> <nav className="control-nav" aria-label="Control plane navigation"> <p>Manage Flarebot</p> <a href={`${overview}#cloudflare-account`}>Cloudflare account</a> <a href={`${overview}#installations`}>Installations</a> <a href={`${overview}#permissions`}>Permissions and access</a> {page && ( <span className="control-nav-current" aria-current="page"> {page} </span> )} </nav> <main id="main-content" tabIndex={-1}> <div className="control-page-heading"> {page && ( <nav className="control-breadcrumb" aria-label="Breadcrumb"> <a href="/connect">Overview</a> <span aria-hidden="true">/</span> <span aria-current="page">{page}</span> </nav> )} <h1>{title}</h1> <p>{description}</p> </div> <div className={ page ? "control-content control-detail" : "control-content" } > {children} </div> </main> </div> </div> );}