Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

[Bug]: Usage Day breakdown columns overlap in narrow windows

Aperta Adatta ai principianti
  • Qualcosa non va?
#14,317 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@0pilatos0 ci sta già lavorando.

Dal 29/9/2026.

  • #14318 di @0pilatos0 — aperta

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
75/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
frontend

Direzione di ricerca

Inizia in apps/web individuando la tabella Day breakdown della pagina Usage e riproduci la sovrapposizione in un viewport largo 390px con Cost e 30 days selezionati. Esamina il layout responsive della tabella e verifica che intestazioni e valori rimangano leggibili, con lo scorrimento orizzontale disponibile quando necessario.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Before submitting
  • I searched existing issues and did not find a duplicate.
  • I included enough detail to reproduce the problem.
Area

apps/web

Steps to reproduce
  1. Have usage activity from Codex, Claude Code, and OpenCode within the selected period.
  2. Open Usage, select Cost and 30 days, then choose Day under Breakdown.
  3. Resize the web viewport to 390px wide and scroll to the breakdown table.
Expected behavior

Column headers and values remain readable. A narrow viewport can scroll the table horizontally if needed.

Actual behavior

Provider headers and adjacent dollar amounts overlap. The fixed table reserves 40% for the date and divides the remaining 60% among the provider, total, and token columns.

Usage Day breakdown at 390px: headers and values overlap

Impact

Minor bug: daily usage amounts are hard to read in narrow windows.

Version or commit

main @ d15210cd3d

Environment

macOS, T3 Browser panel, web client at a 390 × 700 CSS-pixel viewport. Reproduced with real usage data copied into isolated development state.

Workaround

Widen the viewport. The same table is readable at 640px.

Lingua principale
TypeScript
Stelle
24.8k
Fork
6.4k
Merge medio
6h 53m
PR unite (30g)
222

Preparare l'ambiente

Apri in Codespaces

Avvia il container di sviluppo del progetto nel browser, con il tuo account GitHub.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di pingdotgg/t3code

Tutte le issue di pingdotgg/t3code

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.