Frameless Hero Dashboard Media Card & Visual Streamlining
Landing PageVisual DesignWeb App
Streamlined the hero dashboard preview: removed all simulated browser headers, window bars, and artificial controls in favor of a sleek, high-contrast frameless media card with subtle depth borders matching the CLI and MCP showcase cards.
#Frameless Hero Dashboard Media Card & Visual Streamlining
This release strips all artificial browser header chrome for an ultra-clean, modern aesthetic:
- Frameless Media Card: Replaced simulated browser header bars and window controls with a crisp, border-elevated media card matching the CLI and MCP showcase containers.
- Adaptive Mobile Dashboard Visual: Automatically serves the dedicated mobile dashboard preview (
apivault-dashboard-mobile.png) on screens ≤640px for high-density readability and the wide desktop view on larger viewports. - Docs-Style Mobile Step Timeline: Rebuilt the "Up and running in minutes" steps on mobile viewports into a continuous vertical timeline rail with circular numbered markers, connecting lines, and clean hierarchy mirroring the documentation quickstart guide.
- Interactive Feature Accordion: Replaced static feature checklists with an interactive, auto-advancing accordion rail (mirroring top developer platforms). Features seamlessly expand their descriptions while a subtle border progress indicator guides the user, eliminating generic widget UI.
- Double-Track Integrations Marquee: Upgraded the Supported Tools section into a dense, premium double-track marquee with bi-directional scrolling and sleek glass-pill integration logos.
- Visual Consistency: Unified the visual language across all hero and feature product screenshots with consistent border tokens, dark/light theme solid backgrounds, and subtle hover elevations.