ArchitectureDiagram
Isometric architecture diagram combining exploded-view layering with cross-hatching for infrastructure layers.
import { ArchitectureDiagram } from "@sigil-ui/components";
<ArchitectureDiagram>...</ArchitectureDiagram>
| Prop | Type | Default | Description |
|---|
layers | ArchitectureLayer[] | — | Layers from top (highest abstraction) to bottom (infrastructure). |
title | string | — | Title for the diagram. |
gap | string | 1.5rem | Gap between layers. |
| CSS Variable | Purpose |
|---|
--s-card-radius | Card radius |
--s-border-style | Border style |
--s-border | Border |
--s-surface | Surface |
--s-shadow-sm | Shadow sm |
--s-text | Text |
--s-radius-md | Radius md |
--s-duration-fast | Duration fast |
--s-shadow-md | Shadow md |
--s-border-strong | Border strong |
--s-surface-elevated | Surface elevated |
--s-background | Background |