Something went wrong. Try again.
This repository has no description
Something went wrong. Try again.
2.0 kB · 63 lines
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364import type { OctaneNode } from "octane";import { CloudflareLogo } from "octane-kumo/components/cloudflare-logo";
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> </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> );}