fix(ui): polish CLI summary colors, HTML tab-bar, transitions

Author: orenlab

CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## [1.4.1] - 2026-02-15
+
+### CLI
+
+- Semantic summary colors: clone counts → `bold yellow`, file metrics → neutral `bold`
+- Phase separator, bold report paths, "Done in X.Xs" timing line
+
+### HTML Report
+
+- HiDPI chart canvas, hit-line markers with Pygments, cross-browser `<select>`
+- Platform-aware shortcut labels (`⌘` / `Ctrl+`), color-coded section borders
+- Compact code lines, proper tab-bar for novelty filter, polished transitions
+- Rounded-rect badges (`6px`), tighter card radii (`10px`), cleaner empty states
+
+---
+
 ## [1.4.0] - 2026-02-12
 
 ### Overview

codeclone/_cli_summary.py

@@ -14,6 +14,14 @@
 
 from . import ui_messages as ui
 
+_CLONE_LABELS = frozenset(
+    {
+        ui.SUMMARY_LABEL_FUNCTION,
+        ui.SUMMARY_LABEL_BLOCK,
+        ui.SUMMARY_LABEL_SEGMENT,
+    }
+)
+
 
 def _summary_value_style(*, label: str, value: int) -> str:
     if value == 0:
@@ -22,7 +30,9 @@ def _summary_value_style(*, label: str, value: int) -> str:
         return "bold red"
     if label == ui.SUMMARY_LABEL_SUPPRESSED:
         return "yellow"
-    return "bold green"
+    if label in _CLONE_LABELS:
+        return "bold yellow"
+    return "bold"
 
 
 def _build_summary_rows(

codeclone/_html_snippets.py

@@ -196,9 +196,16 @@ def _render_code_block(
             rendered.append(
                 f'<div class="{cls}">{html.escape(text, quote=False)}</div>'
             )
-        body = "\n".join(rendered)
+        body = "".join(rendered)
     else:
-        body = highlighted
+        hit_flags = [hit for hit, _ in numbered]
+        pyg_lines = highlighted.split("\n")
+        rendered_pyg: list[str] = []
+        for i, pyg_line in enumerate(pyg_lines):
+            hit = hit_flags[i] if i < len(hit_flags) else False
+            cls = "hitline" if hit else "line"
+            rendered_pyg.append(f'<div class="{cls}">{pyg_line}</div>')
+        body = "".join(rendered_pyg)
 
     return _Snippet(
         filepath=filepath,

codeclone/cli.py

@@ -2,6 +2,7 @@
 
 import os
 import sys
+import time
 from collections.abc import Mapping, Sequence
 from concurrent.futures import Future, ProcessPoolExecutor, as_completed
 from dataclasses import asdict, dataclass
@@ -17,6 +18,7 @@
     TextColumn,
     TimeElapsedColumn,
 )
+from rich.rule import Rule
 from rich.theme import Theme
 
 from . import __version__
@@ -76,7 +78,7 @@
 
 
 def _make_console(*, no_color: bool) -> Console:
-    return Console(theme=custom_theme, width=200, no_color=no_color)
+    return Console(theme=custom_theme, width=100, no_color=no_color)
 
 
 console = _make_console(no_color=False)
@@ -238,6 +240,8 @@ def _main_impl() -> None:
         )
         sys.exit(ExitCode.CONTRACT_ERROR)
 
+    t0 = time.monotonic()
+
     if not args.quiet:
         print_banner()
 
@@ -749,6 +753,9 @@ def process_sequential(with_progress: bool) -> None:
     new_func, new_block = baseline_for_diff.diff(func_groups, block_groups)
     new_clones_count = len(new_func) + len(new_block)
 
+    if not args.quiet:
+        console.print(Rule(style="dim"))
+
     _print_summary(
         console=console,
         quiet=args.quiet,
@@ -900,6 +907,10 @@ def _write_report_output(*, out: Path, content: str, label: str) -> None:
     if not args.update_baseline and not args.fail_on_new and new_clones_count > 0:
         console.print(ui.WARN_NEW_CLONES_WITHOUT_FAIL)
 
+    if not args.quiet:
+        elapsed = time.monotonic() - t0
+        console.print(f"\n[dim]Done in {elapsed:.1f}s[/dim]")
+
 
 def main() -> None:
     try:

codeclone/html_report.py

@@ -760,10 +760,9 @@ def _meta_value_html(label: str, value: object) -> str:
         f'<div class="meta-panel" id="report-meta" {meta_attrs}>'
         '<div class="meta-header">'
         '<div class="meta-title">'
-        f"{chevron_icon}"
         "Report Provenance"
         "</div>"
-        '<div class="meta-toggle collapsed">▸</div>'
+        f'<div class="meta-toggle collapsed">{chevron_icon}</div>'
         "</div>"
         '<div class="meta-content collapsed">'
         f'<div class="meta-grid">{meta_rows_html}</div>'