Files
lmiranda 5152cda161 refactor(viz-platform): extract skills and slim commands
Extract shared knowledge from 10 commands into 7 reusable skills:
- mcp-tools-reference.md: All viz-platform MCP tool signatures
- theming-system.md: Theme tokens, CSS variables, color palettes
- accessibility-rules.md: WCAG contrast, color-blind safe palettes
- dmc-components.md: DMC categories, validation, common props
- responsive-design.md: Breakpoints, mobile-first, grid config
- chart-types.md: Plotly chart types, export formats, resolution
- layout-templates.md: Dashboard templates, filter types

All commands now reference skills via "Skills to Load" section.
Commands reduced from 1396 lines total to 427 lines (69% reduction).

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-30 16:59:26 -05:00

1.6 KiB

Layout Templates

Available Templates

Basic

Single-column layout with header and content area.

+-----------------------------+
|          Header             |
+-----------------------------+
|                             |
|          Content            |
|                             |
+-----------------------------+

Sidebar

Layout with collapsible sidebar navigation.

+--------+--------------------+
|        |       Header       |
|  Nav   +--------------------+
|        |                    |
|        |      Content       |
|        |                    |
+--------+--------------------+

Tabs

Tabbed layout for multi-page dashboards.

+-----------------------------+
|          Header             |
+------+------+------+--------+
| Tab1 | Tab2 | Tab3 |        |
+------+------+------+--------+
|                             |
|       Tab Content           |
|                             |
+-----------------------------+

Split

Split-pane layout for comparisons.

+-----------------------------+
|          Header             |
+--------------+--------------+
|              |              |
|    Left      |    Right     |
|    Pane      |    Pane      |
|              |              |
+--------------+--------------+

Filter Types

Available filter components:

  • dropdown - Single/multi-select dropdown
  • date_range - Date range picker
  • slider - Numeric range slider
  • checkbox - Checkbox group
  • search - Text search input

Output

Layout structures can be:

  • Used with page tools to create full app
  • Rendered as a Dash layout
  • Combined with chart components