optics-context
Optics Design Framework
Apply the Optics design system for consistent, token-based styling in Rails applications.
Core Principles
- Use tokens, not hard-coded values - All colors, spacing, typography from
assets/tokens.json - Follow BEM structure - Block, Element, Modifier naming conventions
- Check existing components first - Reuse before creating new
- Progressive enhancement - Start with semantic HTML, layer styles
Finding Optics Classes
Search for components in this order:
- Check Optics components -
skills/optics-context/assets/components.json- Find appropriate component, modifiers, and attributes
- Modify using BEM if needed
- Search project styles - Look in
app/assets/stylesheetsfor existing classes
More from rolemodel/rolemodel-skills
bem-structure
Expert guidance for writing, refactoring, and structuring CSS using BEM (Block Element Modifier) methodology. Provides proper CSS class naming conventions, component structure, and Optics design system integration for maintainable, scalable stylesheets.
86routing-patterns
Review, generate, and update Rails routes following professional patterns and best practices. Covers RESTful resource routing, route concerns for code reusability, shallow nesting strategies, and advanced route configurations.
30turbo-fetch
Implement dynamic form updates using Turbo Streams and Stimulus. Use when forms need to update fields based on user selections without full page reloads, such as cascading dropdowns, conditional fields, or dynamic option lists.
28stimulus-controllers
Create and register Stimulus controllers for interactive JavaScript features. Use when adding client-side interactivity, dynamic UI updates, or when the user mentions Stimulus controllers or JavaScript behavior.
27controller-patterns
Review and update existing Rails controllers and generate new controllers following professional patterns and best practices. Covers RESTful conventions, authorization patterns, proper error handling, and maintainable code organization.
27testing-patterns
Write automated tests using RSpec, Capybara, and FactoryBot for Rails applications. Use when implementing features, fixing bugs, or when the user mentions testing, specs, RSpec, Capybara, or test data. Avoid using rails console or server for testing.
27