Redesign audit report UI with modern styling and interactive features - #14
Merged
Conversation
Report template: - Sticky topbar with brand icon and generation timestamp - SVG animated health-score ring (stroke-dashoffset driven by score) - Fourth summary card for Info count alongside Critical and Warnings - Per-severity background tints on issue cards (critical → red tint, etc.) - Affected resource tags displayed as monospace pills on each finding - Severity filter buttons (All / Critical / Warnings / Info) with JS filtering - Responsive grid: 4-col → 2-col → 1-col at 960px / 600px breakpoints - Print-friendly CSS: static topbar, hidden filter bar, no hover transforms Python: - cli.py: compute info_count and include in summary dict / JSON report - renderer.py: compute ring_offset (251.3 × (1 − score/100)) and pass to template Documentation: - README: full rewrite — CLI reference table, exit codes, diff workflow, comparison table, PyPI badge - CHANGELOG: proper [Unreleased] / [0.1.0] comparison links; UI changes documented - CONTRIBUTING: template variable reference table; rule/connector guides tightened - docs/architecture.md: diff command, ring_offset, health score formula, updated tables - docs/configuration.md: rules section, severity_overrides table, exit codes - docs/ci-integration.md: diff regression detection workflow, threshold guide, exit codes table - docs/bugs_improvements.md: completed items marked; open roadmap items listed https://claude.ai/code/session_01L8mATgWmPBhqkS8JyP3fsx
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR completely redesigns the PipelineProbe audit report HTML template with a modern, professional UI featuring a sticky topbar, animated health-score visualization, severity-based filtering, and improved visual hierarchy. The report is now client-ready and suitable for sharing in presentations and documentation.
Key Changes
Report UI Overhaul (
pipelineprobe/templates/report.html)Report Data (
pipelineprobe/cli.py&pipelineprobe/renderer.py)info_countto summary statistics (alongside critical and warning counts)Documentation Updates
pipelineprobe diffImplementation Details
<circle>elements with stroke-dasharray/stroke-dashoffset for smooth visual representationgrid-template-columns: 260px 1fr 1fr 1frfor balanced card distribution@media printrules to ensure reports render cleanly when printed or saved as PDFhttps://claude.ai/code/session_01L8mATgWmPBhqkS8JyP3fsx