diff options
| author | Adam <[email protected]> | 2026-02-05 07:26:21 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2026-02-05 14:21:12 -0600 |
| commit | 26b786dd3feb474aca3434e51000047d9ffaf423 (patch) | |
| tree | 0fb3c74b11a1de2809376efe8627f837d767e840 /packages/ui/src | |
| parent | afce869d3be930067e31fbbaabc9f5c48c5eac4b (diff) | |
| download | opencode-26b786dd3feb474aca3434e51000047d9ffaf423.tar.gz opencode-26b786dd3feb474aca3434e51000047d9ffaf423.zip | |
fix(ui): toast overflow
Diffstat (limited to 'packages/ui/src')
| -rw-r--r-- | packages/ui/src/components/toast.css | 15 |
1 files changed, 14 insertions, 1 deletions
diff --git a/packages/ui/src/components/toast.css b/packages/ui/src/components/toast.css index 1459bb189..ed7ba4a20 100644 --- a/packages/ui/src/components/toast.css +++ b/packages/ui/src/components/toast.css @@ -6,7 +6,7 @@ display: flex; flex-direction: column; gap: 8px; - max-width: 400px; + max-width: min(400px, calc(100vw - 64px)); width: 100%; pointer-events: none; @@ -21,6 +21,7 @@ } [data-component="toast"] { + position: relative; display: flex; align-items: flex-start; gap: 20px; @@ -91,10 +92,14 @@ flex-direction: column; gap: 2px; min-width: 0; + overflow: hidden; } [data-slot="toast-title"] { color: var(--text-invert-strong); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; /* text-14-medium */ font-family: var(--font-family-sans); @@ -110,6 +115,8 @@ [data-slot="toast-description"] { color: var(--text-invert-base); text-wrap-style: pretty; + overflow-wrap: anywhere; + word-break: break-word; /* text-14-regular */ font-family: var(--font-family-sans); @@ -124,6 +131,7 @@ [data-slot="toast-actions"] { display: flex; + flex-wrap: wrap; gap: 16px; margin-top: 8px; } @@ -133,6 +141,11 @@ border: none; padding: 0; cursor: pointer; + min-width: 0; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; color: var(--text-invert-weak); font-family: var(--font-family-sans); |