|
170 | 170 | background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg); |
171 | 171 | overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch} |
172 | 172 | .main-tabs::-webkit-scrollbar{display:none} |
173 | | -.main-tab{position:relative;flex:1;text-align:center;padding:var(--sp-2) var(--sp-3); |
174 | | - background:none;border:none;cursor:pointer;font-size:.85rem;font-weight:500; |
175 | | - color:var(--text-muted);white-space:nowrap;border-radius:var(--radius-md); |
176 | | - transition:all var(--dur-fast) var(--ease)} |
| 173 | +.main-tab{position:relative;flex:1;display:inline-flex;align-items:center;justify-content:center; |
| 174 | + gap:var(--sp-1);text-align:center;padding:var(--sp-2) var(--sp-3);background:none; |
| 175 | + border:none;cursor:pointer;font-size:.85rem;font-weight:500;color:var(--text-muted); |
| 176 | + white-space:nowrap;border-radius:var(--radius-md);transition:all var(--dur-fast) var(--ease)} |
177 | 177 | .main-tab:hover{color:var(--text-primary);background:var(--bg-raised)} |
178 | 178 | .main-tab[aria-selected="true"]{color:var(--accent-primary);background:var(--accent-muted)} |
| 179 | +.main-tab-icon{flex-shrink:0;opacity:.72} |
| 180 | +.main-tab-label{display:inline-flex;align-items:center} |
179 | 181 | .tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px; |
180 | 182 | height:18px;padding:0 5px;font-size:.7rem;font-weight:700;border-radius:9px; |
181 | 183 | background:var(--bg-overlay);color:var(--text-muted);margin-left:var(--sp-1)} |
|
656 | 658 | .breakdown-bar-track{height:6px;border-radius:3px;background:var(--bg-raised);overflow:hidden} |
657 | 659 | .breakdown-bar-fill{display:block;height:100%;border-radius:3px; |
658 | 660 | background:var(--accent-primary);transition:width .6s var(--ease)} |
| 661 | +/* Directory hotspot entries */ |
| 662 | +.dir-hotspot-list{display:flex;flex-direction:column;gap:0} |
| 663 | +.dir-hotspot-entry{padding:var(--sp-2) 0;border-bottom:1px solid color-mix(in srgb,var(--border) 50%,transparent)} |
| 664 | +.dir-hotspot-entry:last-child{border-bottom:none;padding-bottom:0} |
| 665 | +.dir-hotspot-entry:first-child{padding-top:0} |
| 666 | +.dir-hotspot-path{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:4px;min-width:0} |
| 667 | +.dir-hotspot-path code{font-size:.78rem;font-weight:600;color:var(--text-primary);line-height:1.3} |
| 668 | +.dir-hotspot-bar-row{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:3px} |
| 669 | +.dir-hotspot-bar-track{flex:1;height:4px;border-radius:2px;background:var(--bg-raised); |
| 670 | + overflow:hidden;display:flex} |
| 671 | +.dir-hotspot-bar-prev{height:100%;background:var(--text-muted);opacity:.18} |
| 672 | +.dir-hotspot-bar-cur{height:100%;background:var(--accent-primary);opacity:.7} |
| 673 | +.dir-hotspot-pct{font-size:.7rem;font-weight:600;font-variant-numeric:tabular-nums; |
| 674 | + color:var(--text-muted);min-width:3.2em;text-align:right} |
| 675 | +.dir-hotspot-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:.68rem;color:var(--text-muted)} |
| 676 | +.dir-hotspot-meta span{font-variant-numeric:tabular-nums} |
| 677 | +.dir-hotspot-meta-sep{opacity:.3} |
659 | 678 | /* Health radar chart */ |
660 | 679 | .health-radar{display:flex;justify-content:center;padding:var(--sp-3) 0} |
661 | 680 | .health-radar svg{width:100%;max-width:520px;height:auto;overflow:visible} |
|
781 | 800 | .suggestion-sev-inline{font-size:.72rem;font-weight:600;padding:1px var(--sp-1); |
782 | 801 | border-radius:var(--radius-sm)} |
783 | 802 | .suggestion-title{font-weight:600;font-size:.85rem;color:var(--text-primary);flex:1;min-width:0} |
784 | | -.suggestion-meta{display:flex;align-items:center;gap:var(--sp-1);flex-shrink:0;flex-wrap:wrap} |
785 | | -.suggestion-meta-badge{font-size:.68rem;font-family:var(--font-mono);font-weight:500; |
786 | | - padding:1px var(--sp-2);border-radius:var(--radius-sm);background:var(--bg-overlay); |
787 | | - color:var(--text-muted);white-space:nowrap} |
| 803 | +.suggestion-meta{display:flex;align-items:center;gap:var(--sp-2);flex-shrink:0;flex-wrap:wrap} |
| 804 | +.suggestion-meta-badge{font-size:.68rem;font-weight:600;padding:2px var(--sp-2); |
| 805 | + border-radius:999px;background:var(--bg-overlay);color:var(--text-muted); |
| 806 | + white-space:nowrap;line-height:1.2;font-variant-numeric:tabular-nums} |
788 | 807 | .suggestion-effort--easy{color:var(--success);background:var(--success-muted, rgba(34,197,94,.1))} |
789 | 808 | .suggestion-effort--moderate{color:var(--warning);background:var(--warning-muted)} |
790 | 809 | .suggestion-effort--hard{color:var(--error);background:var(--error-muted)} |
|
1092 | 1111 | linear-gradient(to left,rgba(0,0,0,.12),transparent) right center / 10px 100% no-repeat scroll, |
1093 | 1112 | var(--bg-surface)} |
1094 | 1113 | .main-tab{flex:none;padding:var(--sp-1) var(--sp-2);font-size:.78rem} |
| 1114 | + .main-tab-icon{width:13px;height:13px} |
1095 | 1115 | } |
1096 | 1116 | @media(max-width:480px){ |
1097 | 1117 | .overview-kpi-grid{grid-template-columns:1fr} |
|
0 commit comments