feat: bold dashboard redesign with inline stats, section labels, and chip icons
Restructure QuickStartPage for a more professional, informative layout: - Left-aligned hero greeting (text-4xl) with date context and inline stat strip - GreetingStatStrip shows resolved/active/MTTR at a glance - Remove collapsible toggle — dashboard stats always visible - Section labels with trailing border lines for visual hierarchy - Suggestion chips with category icons, card-style hover, press feedback - Fix cyan focus ring and icon color to ember orange design system - Session cards: line-clamp-2 descriptions, font-medium text, problem_domain metadata - Widen container max-w-3xl → max-w-4xl for breathing room - Add .impeccable.md and .github/copilot-instructions.md design context - CLAUDE.md audit: fix stale references, remove duplication, update counts Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
32
.github/copilot-instructions.md
vendored
Normal file
32
.github/copilot-instructions.md
vendored
Normal file
@@ -0,0 +1,32 @@
|
||||
# Copilot Instructions — ResolutionFlow
|
||||
|
||||
## Design Context
|
||||
|
||||
### Users
|
||||
MSP engineers — IT professionals at Managed Service Providers who troubleshoot infrastructure and support issues for multiple client companies. They work under ticket pressure, need to resolve issues fast, and produce clean documentation automatically.
|
||||
|
||||
### Brand Personality
|
||||
**Three words:** Professional, Modern, SaaS
|
||||
**Voice:** Direct, competent, no fluff. Built by MSP engineers, for MSP engineers.
|
||||
**Emotional goals:** Confidence, competence, clarity, focus.
|
||||
|
||||
### Aesthetic Direction
|
||||
- Flat, high-contrast dark theme (Sentry/PostHog-inspired). Premium and clean.
|
||||
- **References:** Notion (clarity), Stripe (polish), Figma (functional density)
|
||||
- **Anti-references:** Microsoft Teams (clutter), Kaseya VSA 9 (dated patterns)
|
||||
- Accent: ember orange (#f97316), max 5% of UI. No glassmorphism, no gradient surfaces, no ambient effects.
|
||||
- See `DESIGN-SYSTEM.md` for full token and component specs.
|
||||
|
||||
### Accessibility
|
||||
- WCAG 2.2 AA baseline
|
||||
- Enhanced focus appearance on all interactive elements
|
||||
- 7:1 contrast ratio for data visualization colors
|
||||
- `prefers-reduced-motion` fully supported
|
||||
- Never rely on color alone for status — pair with icons or text
|
||||
|
||||
### Design Principles
|
||||
1. **Clarity over decoration.** Every pixel should communicate. No ornamental effects.
|
||||
2. **Density without clutter.** Use typography hierarchy and spacing to create structure, not chrome.
|
||||
3. **Confidence through consistency.** Same patterns, same tokens, same behavior everywhere.
|
||||
4. **Speed is a feature.** Minimize clicks. Copilot-first — primary interaction is typing.
|
||||
5. **Accessible by default.** WCAG 2.2, enhanced focus, high-contrast data viz, motion sensitivity.
|
||||
Reference in New Issue
Block a user