detail-panel-section
CommunityAdd per-aircraft detail panel sections.
AuthorMrSuttonmann
Version1.0.0
Installs0
System Documentation
What problem does it solve?
The skill provides a structured approach to extend the aircraft detail panel in the app by adding new per-aircraft information sections with a consistent build/update workflow.
Core Features & Use Cases
- Placeholder DOM scaffolding in buildPopupContent for new sections.
- Per-tick updater functions to mutate existing placeholders without rebuilding HTML.
- Help-icon wiring and CSS guidelines to maintain consistent panel width and layout.
- Automated Playwright smoke tests to verify the panel renders correctly and remains within the viewport.
Quick Start
Follow the steps above to implement a new detail-panel section: create the placeholder DOM, implement the per-tick updater, wire help icons, style with CSS, ensure panel width, and extend tests.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: detail-panel-section Download link: https://github.com/MrSuttonmann/flightjar/archive/main.zip#detail-panel-section Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.