Skip to content

Commit 6649295

Browse files
authored
🤖 Add viewport expansion hint to vertical token meter tooltip (#278)
## What Add a subtle hint at the bottom of the vertical token meter tooltip suggesting users expand their viewport to see full sidebar details. ## Why When the sidebar is collapsed to the 20px vertical bar (on smaller viewports), users may not realize they can expand their window to see the full Costs/Tools tabs with detailed breakdowns. This hint guides discovery. ## How Added italic text below the token totals: "💡 Expand your viewport to see full details" Styling: - Subdued gray color (#666) - Smaller font (10px) - 8px top margin for spacing ## Testing Visual inspection: hover over vertical token meter bar and verify hint appears at bottom of tooltip. _Generated with `cmux`_
1 parent 0975e3f commit 6649295

File tree

1 file changed

+5
-0
lines changed

1 file changed

+5
-0
lines changed

src/components/ChatMetaSidebar/VerticalTokenMeter.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,11 @@ const VerticalTokenMeterComponent: React.FC<{ data: TokenMeterData }> = ({ data
154154
{data.maxTokens && ` / ${formatTokens(data.maxTokens)}`}
155155
{data.maxTokens && ` (${data.totalPercentage.toFixed(1)}%)`}
156156
</div>
157+
<div
158+
style={{ color: "#666666", fontSize: 10, marginTop: 8, fontStyle: "italic" }}
159+
>
160+
💡 Expand your viewport to see full details
161+
</div>
157162
</Content>
158163
</Tooltip>
159164
</TooltipWrapper>

0 commit comments

Comments
 (0)