lmiranda
5152cda161
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>
44 lines
1.1 KiB
Markdown
44 lines
1.1 KiB
Markdown
---
|
|
description: Configure responsive breakpoints for dashboard layouts
|
|
---
|
|
|
|
# Configure Breakpoints
|
|
|
|
## Skills to Load
|
|
- skills/mcp-tools-reference.md
|
|
- skills/responsive-design.md
|
|
|
|
## Visual Output
|
|
|
|
```
|
|
+------------------------------------------------------------------+
|
|
| VIZ-PLATFORM - Breakpoints |
|
|
+------------------------------------------------------------------+
|
|
```
|
|
|
|
Configure responsive breakpoints for mobile-first design across screen sizes.
|
|
|
|
## Usage
|
|
|
|
```
|
|
/breakpoints {layout_ref}
|
|
```
|
|
|
|
## Arguments
|
|
|
|
- `layout_ref` (required): Layout name to configure breakpoints for
|
|
|
|
## Workflow
|
|
|
|
1. **User invokes**: `/breakpoints my-dashboard`
|
|
2. **Agent asks**: Which breakpoints to customize? (shows current settings)
|
|
3. **Agent asks**: Mobile column count? (xs, typically 1-2)
|
|
4. **Agent asks**: Tablet column count? (md, typically 4-6)
|
|
5. **Agent applies**: Breakpoint configuration via `layout_set_breakpoints`
|
|
6. **Agent returns**: Complete responsive configuration
|
|
|
|
## Related Commands
|
|
|
|
- `/dashboard {template}` - Create layout with default breakpoints
|
|
- `/theme {name}` - Theme includes default spacing values
|