tech-debt-visualizer 0.2.20 → 0.2.21

package/dist/llm.js

@@ -328,7 +328,7 @@ All files in this codebase: ${allFiles.join(", ")}
 Top risk files (by hotspot): ${topFiles.join(", ")}
 
 Output only:
-1. A single paragraph of 7–10 sentences that gives full context for the whole codebase. Cover ALL files: briefly note which files or areas are in good shape, which have issues, and how they fit together. Include strengths, main concerns, and the single most important improvement. Write for someone who needs to understand the entire codebase, not just the problematic parts. No code block unless absolutely necessary.
+1. A single paragraph of 5–8 sentences that gives full context for the whole codebase. Cover ALL files: briefly note which files or areas are in good shape, which have issues, and how they fit together. Include strengths, main concerns, and the single most important improvement. Write for someone who needs to understand the entire codebase, not just the problematic parts. No code block unless absolutely necessary.
 2. On the next line write only one word: critical, high, medium, low, or none (overall codebase technical debt severity).
 3. On the line after that write only a number 0-100 (0 = most debt, 100 = least debt / cleanest).
 No preamble.`;

package/dist/reports/assets/report.css

@@ -146,14 +146,20 @@ body.dashboard-page {
 }
 
 .dashboard-score-value { font-size: 1.25rem; line-height: 1; }
-.dashboard-score-of { font-size: 0.85rem; font-weight: 500; color: var(--text-muted); }
+.dashboard-score-of { font-size: 0.85rem; font-weight: 500; }
 .dashboard-score-label { font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; margin-left: 0.35rem; opacity: 0.95; }
 
-.dashboard-score.tier-1 { background: rgba(229, 57, 53, 0.2); color: #ff8a80; font-weight: 700; }
-.dashboard-score.tier-2 { background: rgba(245, 124, 0, 0.2); color: #ffb74d; font-weight: 700; }
-.dashboard-score.tier-3 { background: rgba(249, 168, 37, 0.2); color: #ffd54f; font-weight: 700; }
-.dashboard-score.tier-4 { background: rgba(41, 182, 246, 0.2); color: #82b1ff; font-weight: 700; }
-.dashboard-score.tier-5 { background: rgba(67, 160, 71, 0.2); color: #81c784; font-weight: 700; }
+/* Match hero score panel tier colors (1=worst, 5=best) */
+.dashboard-score.tier-1 { background: rgba(255, 107, 107, 0.2); color: #ff6b6b; font-weight: 700; }
+.dashboard-score.tier-1 .dashboard-score-of { color: rgba(255, 107, 107, 0.9); }
+.dashboard-score.tier-2 { background: rgba(255, 107, 53, 0.2); color: #ff6b35; font-weight: 700; }
+.dashboard-score.tier-2 .dashboard-score-of { color: rgba(255, 107, 53, 0.95); }
+.dashboard-score.tier-3 { background: rgba(255, 179, 71, 0.2); color: #ffd23f; font-weight: 700; }
+.dashboard-score.tier-3 .dashboard-score-of { color: rgba(255, 210, 63, 0.95); }
+.dashboard-score.tier-4 { background: rgba(78, 205, 196, 0.2); color: #4ecdc4; font-weight: 700; }
+.dashboard-score.tier-4 .dashboard-score-of { color: rgba(78, 205, 196, 0.95); }
+.dashboard-score.tier-5 { background: rgba(6, 255, 165, 0.2); color: #06ffa5; font-weight: 700; }
+.dashboard-score.tier-5 .dashboard-score-of { color: rgba(6, 255, 165, 0.95); }
 
 .dashboard-date {
   font-size: 12px;
@@ -550,20 +556,59 @@ body.dashboard-page {
   font-weight: 600;
 }
 
-/* ——— Hero-style score panel (reference look) ——— */
+/* ——— Hero-style score panel: colors tied to tier (1=worst, 5=best) ——— */
 .panel-score-pop {
+  --score-accent-a: #ff6b35;
+  --score-accent-b: #ff3366;
+  --score-glow: rgba(255, 107, 53, 0.35);
   border: 2px solid rgba(255, 107, 53, 0.3);
-  box-shadow: var(--glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
   background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--surface-hover) 100%);
 }
 
+.panel-score-pop[data-tier="1"] {
+  --score-accent-a: #ff6b6b;
+  --score-accent-b: #e53935;
+  --score-glow: rgba(229, 57, 53, 0.35);
+  border-color: rgba(229, 57, 53, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+}
+.panel-score-pop[data-tier="2"] {
+  --score-accent-a: #ff6b35;
+  --score-accent-b: #ff3366;
+  --score-glow: rgba(255, 107, 53, 0.35);
+  border-color: rgba(255, 107, 53, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+}
+.panel-score-pop[data-tier="3"] {
+  --score-accent-a: #ffb347;
+  --score-accent-b: #ffd23f;
+  --score-glow: rgba(255, 210, 63, 0.3);
+  border-color: rgba(255, 210, 63, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+}
+.panel-score-pop[data-tier="4"] {
+  --score-accent-a: #4ecdc4;
+  --score-accent-b: #29b6f6;
+  --score-glow: rgba(78, 205, 196, 0.3);
+  border-color: rgba(78, 205, 196, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+}
+.panel-score-pop[data-tier="5"] {
+  --score-accent-a: #06ffa5;
+  --score-accent-b: #43a047;
+  --score-glow: rgba(6, 255, 165, 0.3);
+  border-color: rgba(6, 255, 165, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+}
+
 .panel-score-pop::before {
   display: none;
 }
 
 .panel-score-pop:hover {
   transform: none;
-  box-shadow: var(--glow), 0 20px 60px rgba(0, 0, 0, 0.4);
+  box-shadow: 0 0 30px var(--score-glow), 0 20px 60px rgba(0, 0, 0, 0.4);
 }
 
 .panel-score-pop .panel-body-score {
@@ -587,22 +632,22 @@ body.dashboard-page {
   font-size: 3.25rem;
   font-weight: 800;
   line-height: 1;
-  background: linear-gradient(180deg, var(--accent-orange) 0%, var(--accent-red) 100%);
+  background: linear-gradient(180deg, var(--score-accent-a) 0%, var(--score-accent-b) 100%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
-  filter: drop-shadow(0 0 20px rgba(255, 107, 53, 0.35));
+  filter: drop-shadow(0 0 20px var(--score-glow));
 }
 
 .panel-score-pop .score-of {
   font-size: 1.35rem;
   font-weight: 700;
-  color: var(--text-muted);
+  color: var(--score-accent-a);
 }
 
 .panel-score-pop .score-label {
   display: inline-block;
-  background: linear-gradient(135deg, var(--accent-orange), var(--accent-red));
+  background: linear-gradient(135deg, var(--score-accent-a), var(--score-accent-b));
   padding: 0.45rem 1.1rem;
   border-radius: 50px;
   font-family: "Inter", sans-serif;
@@ -610,12 +655,16 @@ body.dashboard-page {
   font-weight: 700;
   letter-spacing: 0.5px;
   text-transform: uppercase;
-  box-shadow: 0 6px 18px rgba(255, 107, 53, 0.35);
+  box-shadow: 0 6px 18px var(--score-glow);
   margin-bottom: 0.35rem;
   -webkit-text-fill-color: initial;
   color: #fff;
 }
 
+.panel-score-pop[data-tier="3"] .score-label {
+  color: #1a1a1a;
+}
+
 .panel-score-pop .score-desc {
   font-size: 0.9rem;
   color: var(--text-muted);
@@ -652,18 +701,6 @@ body.dashboard-page {
   flex-wrap: wrap;
 }
 
-.panel-score-pop[data-tier="1"] .score-num { --accent-orange: #ff6b6b; --accent-red: #e53935; }
-.panel-score-pop[data-tier="2"] .score-num { --accent-orange: #ff6b35; --accent-red: #ff3366; }
-.panel-score-pop[data-tier="3"] .score-num { --accent-orange: #ffb347; --accent-red: #ffd23f; }
-.panel-score-pop[data-tier="4"] .score-num { --accent-orange: #4ecdc4; --accent-red: #29b6f6; }
-.panel-score-pop[data-tier="5"] .score-num { --accent-orange: #06ffa5; --accent-red: #43a047; }
-
-.panel-score-pop[data-tier="1"] .score-label { background: linear-gradient(135deg, #ff6b6b, #e53935); }
-.panel-score-pop[data-tier="2"] .score-label { background: linear-gradient(135deg, var(--accent-orange), var(--accent-red)); }
-.panel-score-pop[data-tier="3"] .score-label { background: linear-gradient(135deg, #ffb347, #ffd23f); color: #1a1a1a; }
-.panel-score-pop[data-tier="4"] .score-label { background: linear-gradient(135deg, #4ecdc4, #29b6f6); }
-.panel-score-pop[data-tier="5"] .score-label { background: linear-gradient(135deg, #06ffa5, #43a047); }
-
 /* ——— Description of problems panel (top-right) ——— */
 .panel-empty {
   margin: 0;
@@ -1091,12 +1128,12 @@ body.dashboard-page {
 .dashboard-main ::-webkit-scrollbar-thumb,
 .panel-body::-webkit-scrollbar-thumb,
 .overlay-prompt-wrap::-webkit-scrollbar-thumb {
-  background: var(--accent-orange);
+  background: var(--border);
   border-radius: 4px;
 }
 
 .dashboard-main ::-webkit-scrollbar-thumb:hover,
 .panel-body::-webkit-scrollbar-thumb:hover,
 .overlay-prompt-wrap::-webkit-scrollbar-thumb:hover {
-  background: var(--accent-red);
+  background: var(--text-muted);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tech-debt-visualizer",
-  "version": "0.2.20",
+  "version": "0.2.21",
   "description": "Language-agnostic CLI that analyzes repos and generates interactive technical debt visualizations with AI-powered insights",
   "type": "module",
   "main": "dist/index.js",