viberadar 0.3.44 → 0.3.45

package/dist/ui/dashboard.html

@@ -482,56 +482,49 @@
 
     /* ── Test-type cards inside feature detail ───────────────────────────────── */
     .test-type-grid {
-      display: flex;
-      gap: 8px;
-      margin-bottom: 14px;
-      flex-wrap: wrap;
-      align-items: center;
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+      gap: 10px;
+      margin-bottom: 18px;
     }
     .test-type-card {
       display: flex;
-      align-items: center;
-      gap: 8px;
+      flex-direction: column;
       background: var(--bg-card);
       border: 1px solid var(--border);
-      border-left: 3px solid transparent;
+      border-top: 3px solid transparent;
       border-radius: 8px;
-      padding: 7px 12px;
+      padding: 12px 14px 10px;
       cursor: pointer;
       transition: background 0.15s, border-color 0.15s;
-      flex-shrink: 0;
+      min-width: 0;
     }
     .test-type-card:hover { background: var(--bg-hover); }
-    .test-type-card .tt-accent { display: none; } /* replaced by border-left */
-    .test-type-card .tt-label {
-      font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px;
-      color: var(--muted); white-space: nowrap;
-    }
-    .test-type-card .tt-count {
-      font-size: 18px; font-weight: 700; line-height: 1;
-    }
-    .test-type-card .tt-sub {
-      font-size: 11px; color: var(--dim); white-space: nowrap;
-    }
-    .test-type-card.tt-empty { opacity: 0.65; }
-    .test-type-card.tt-active { background: var(--bg-hover); }
+    .test-type-card.tt-active { background: var(--bg-hover); border-color: var(--border); }
+    .test-type-card.tt-empty { opacity: 0.6; }
     .test-type-card.tt-failed {
       border-color: var(--red) !important;
-      background: rgba(248, 81, 73, 0.06);
-    }
-    .tt-chip-actions { display: flex; gap: 4px; margin-left: 4px; }
+      background: rgba(248, 81, 73, 0.05);
+    }
+    .tt-card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
+    .tt-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--muted); }
+    .tt-failed-badge { font-size: 10px; color: var(--red); font-weight: 700; }
+    .tt-count { font-size: 28px; font-weight: 700; line-height: 1; margin-bottom: 2px; }
+    .tt-sub { font-size: 11px; color: var(--dim); }
+    .tt-card-actions { display: flex; flex-direction: column; gap: 5px; margin-top: 10px; }
     .tt-run-btn {
-      display: inline-block; margin: 0;
-      padding: 3px 9px;
+      width: 100%; padding: 5px 10px;
       background: transparent; border: 1px solid var(--border);
-      border-radius: 4px; color: var(--muted); font-size: 10px;
-      cursor: pointer; white-space: nowrap;
+      border-radius: 5px; color: var(--muted); font-size: 11px;
+      cursor: pointer; text-align: center;
       transition: background 0.1s, color 0.1s, border-color 0.1s;
     }
     .tt-run-btn:hover { background: var(--bg-hover); color: var(--text); border-color: var(--dim); }
     .tt-run-btn:disabled { opacity: 0.4; cursor: not-allowed; }
     .tt-fix-btn { border-color: var(--yellow); color: var(--yellow); font-weight: 600; }
     .tt-fix-btn:hover { background: rgba(255,200,0,0.1); color: var(--yellow); border-color: var(--yellow); }
+    .tt-write-btn { border-color: var(--accent); color: var(--accent); }
+    .tt-write-btn:hover { background: rgba(88,166,255,0.1); color: var(--accent); border-color: var(--accent); }
     .file-rows { display: flex; flex-direction: column; gap: 2px; }
     .file-row {
       display: flex;
@@ -1565,30 +1558,38 @@ function renderFeatureCards(c) {
 }
 
 function testTypeCard(type, label, icon, color, count, active, featureKey, failedCount = 0) {
-  const empty = count === 0 && type !== 'source';
+  const empty     = count === 0 && type !== 'source';
   const hasFailed = failedCount > 0 && type !== 'source';
-  const subLabel = type === 'source' ? 'файлов' : (empty ? 'нет тестов' : pluralFiles(count));
+  const subLabel  = type === 'source' ? 'файлов' : (empty ? 'нет тестов' : pluralFiles(count));
   const accentColor = hasFailed ? 'var(--red)' : color;
   const countColor  = hasFailed ? 'var(--red)' : (active || !empty ? color : 'var(--dim)');
 
+  const failedBadge = hasFailed
+    ? `<span class="tt-failed-badge">❌ ${failedCount}</span>`
+    : '';
+
   const runBtn = !empty && type !== 'source' && featureKey
-    ? `<button class="tt-run-btn" onclick="event.stopPropagation();runTests('${featureKey}','${type}')">▶ запустить</button>`
+    ? `<button class="tt-run-btn" onclick="event.stopPropagation();runTests('${featureKey}','${type}')">▶ запустить тесты</button>`
     : '';
   const fixAllBtn = hasFailed && D.agent && featureKey
-    ? `<button class="tt-run-btn tt-fix-btn" onclick="event.stopPropagation();runAgentTask('fix-tests-all','${featureKey}','${type}')">🔧 починить</button>`
+    ? `<button class="tt-run-btn tt-fix-btn" onclick="event.stopPropagation();runAgentTask('fix-tests-all','${featureKey}','${type}')">🔧 починить все</button>`
     : '';
-  const failedBadge = hasFailed
-    ? `<span style="font-size:10px;color:var(--red);font-weight:700;white-space:nowrap">❌ ${failedCount}</span>`
+  const writeBtn = type !== 'source' && D.agent && featureKey
+    ? `<button class="tt-run-btn tt-write-btn" onclick="event.stopPropagation();runAgentTask('write-tests','${featureKey}')">✍ написать тесты</button>`
+    : '';
+  const actions = (runBtn || fixAllBtn || writeBtn)
+    ? `<div class="tt-card-actions">${runBtn}${fixAllBtn}${writeBtn}</div>`
     : '';
-  const actions = (runBtn || fixAllBtn) ? `<div class="tt-chip-actions">${runBtn}${fixAllBtn}</div>` : '';
 
   return `
     <div class="test-type-card${empty ? ' tt-empty' : ''}${active ? ' tt-active' : ''}${hasFailed ? ' tt-failed' : ''}"
-         data-testtype="${type}" style="border-left-color:${accentColor}${active ? ';border-color:' + color : ''}">
-      <span class="tt-label">${icon} ${label}</span>
+         data-testtype="${type}" style="border-top-color:${accentColor}">
+      <div class="tt-card-header">
+        <span class="tt-label">${icon} ${label}</span>
+        ${failedBadge}
+      </div>
       <span class="tt-count" style="color:${countColor}">${count}</span>
       <span class="tt-sub">${subLabel}</span>
-      ${failedBadge}
       ${actions}
     </div>`;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "viberadar",
-  "version": "0.3.44",
+  "version": "0.3.45",
   "description": "Live module map with test coverage for vibecoding projects",
   "main": "./dist/cli.js",
   "bin": {