packages/web: add paste-from-clipboard in compare mode; fix overlaps

Signed-off-by: NotAShelf <raf@notashelf.dev>
Change-Id: I7311a4592d148ebbe8ab72b5091b82a46a6a6964
This commit is contained in:
raf 2026-04-14 09:46:42 +03:00
commit 697f1f1c73
Signed by: NotAShelf
GPG key ID: 29D95B64378DB4BF
3 changed files with 216 additions and 10 deletions

View file

@ -824,6 +824,9 @@ body {
color: var(--text-primary);
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
word-break: break-word;
overflow-wrap: break-word;
line-height: 1.2;
}
.metric-label {
@ -983,6 +986,8 @@ body {
color: var(--text-primary);
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
word-break: break-word;
overflow-wrap: break-word;
}
.chart-legend {
@ -1029,6 +1034,8 @@ body {
color: var(--text-primary);
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
word-break: break-word;
overflow-wrap: break-word;
}
.legend-percent {
@ -1036,6 +1043,8 @@ body {
font-size: 0.75rem;
text-align: right;
min-width: 40px;
word-break: break-word;
overflow-wrap: break-word;
}
.donut-chart svg {
@ -1130,6 +1139,8 @@ body {
color: var(--text-secondary);
min-width: 80px;
text-align: right;
word-break: break-word;
overflow-wrap: break-word;
}
.gc-stats {
@ -1157,6 +1168,8 @@ body {
color: var(--text-primary);
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
word-break: break-word;
overflow-wrap: break-word;
}
/* Operations Chart */
@ -1213,6 +1226,8 @@ body {
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
text-align: right;
word-break: break-word;
overflow-wrap: break-word;
}
/* Thunk Chart */
@ -1267,6 +1282,8 @@ body {
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
text-align: right;
word-break: break-word;
overflow-wrap: break-word;
}
.thunk-ratio {
@ -1294,6 +1311,8 @@ body {
.ratio-label {
font-size: 0.75rem;
color: var(--text-muted);
word-break: break-word;
overflow-wrap: break-word;
}
.dashboard-grid {
@ -1341,6 +1360,8 @@ body {
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
text-align: right;
word-break: break-word;
overflow-wrap: break-word;
}
/* Top Lists */
@ -1384,6 +1405,9 @@ body {
color: var(--text-secondary);
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
word-break: break-word;
overflow-wrap: break-word;
text-align: right;
}
.top-item .location {
@ -1441,6 +1465,36 @@ body {
justify-content: center;
}
.compare-paste-toggle {
display: flex;
gap: 0.25rem;
align-items: flex-end;
padding: 0 0.5rem;
}
.compare-paste-toggle button {
height: calc(0.75rem * 2 + 1rem + 2px);
padding: 0 0.625rem;
background: transparent;
border: 1px solid var(--border-color);
color: var(--text-muted);
border-radius: 0.375rem;
font-size: 0.75rem;
cursor: pointer;
transition: all 0.2s;
}
.compare-paste-toggle button:hover {
background: var(--bg-tertiary);
color: var(--text-primary);
}
.compare-paste-toggle button.active {
background: var(--accent);
border-color: var(--accent);
color: white;
}
.compare-placeholder {
text-align: center;
padding: 4rem;
@ -1510,10 +1564,14 @@ body {
color: var(--text-secondary);
font-family: var(--font-nums);
font-variant-numeric: tabular-nums;
word-break: break-word;
overflow-wrap: break-word;
}
.compare-row .col-change {
text-align: right;
word-break: break-word;
overflow-wrap: break-word;
}
.change-value {