Files

chihlasm dbe66a0568 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>

2026-03-27 05:04:20 +00:00

1.7 KiB

Raw Permalink Blame History

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

Clarity over decoration. Every pixel should communicate. No ornamental effects.
Density without clutter. Use typography hierarchy and spacing to create structure, not chrome.
Confidence through consistency. Same patterns, same tokens, same behavior everywhere.
Speed is a feature. Minimize clicks. Copilot-first — primary interaction is typing.
Accessible by default. WCAG 2.2, enhanced focus, high-contrast data viz, motion sensitivity.

1.7 KiB Raw Permalink Blame History