[PR #24361] [CLOSED] fix: source overflow "+N" badge wraps for 2-digit values #98653

New Issue

GiteaMirror · 2026-05-16T01:28:40-05:00

GiteaMirror commented

2026-05-16 01:28:40 -05:00

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/24361
Author: @Samrj12
Created: 5/4/2026
Status: ❌ Closed

Base: main ← Head: fix/source-overflow-badge-wrap

📝 Commits (1)

775073c fix: prevent source overflow "+N" badge wrap for 2-digit values

📊 Changes

1 file changed (+1 additions, -1 deletions)

View changed files

📝 src/lib/components/chat/Messages/Citations.svelte (+1 -1)

📄 Description

Bug

When a chat response cites 10 or more web sources, the +N overflow badge in the citations row wraps the second digit onto a new line.

The badge container in src/lib/components/chat/Messages/Citations.svelte was hard-sized at size-4 (16×16 px), which can't fit two-digit overflows at the text-[8px] font size used.

Reproduces on 0.9.2 and current main.

Fix

One CSS class change on Citations.svelte:188:

size-4 → min-w-4 h-4 px-1
Added whitespace-nowrap for safety

This keeps the perfect-circle look for single-digit overflows (visually consistent with the favicon row above) and lets the pill grow horizontally for multi-digit values.

Testing

Tested locally; the badge renders correctly for both single-digit and multi-digit overflow values. Pure CSS change, no JS or API impact.

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/24361 **Author:** [@Samrj12](https://github.com/Samrj12) **Created:** 5/4/2026 **Status:** ❌ Closed **Base:** `main` ← **Head:** `fix/source-overflow-badge-wrap` --- ### 📝 Commits (1) - [`775073c`](https://github.com/open-webui/open-webui/commit/775073cb8f85c8d3cd7e2314063a853c3dfb369d) fix: prevent source overflow "+N" badge wrap for 2-digit values ### 📊 Changes **1 file changed** (+1 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `src/lib/components/chat/Messages/Citations.svelte` (+1 -1) </details> ### 📄 Description ## Bug When a chat response cites 10 or more web sources, the `+N` overflow badge in the citations row wraps the second digit onto a new line. The badge container in `src/lib/components/chat/Messages/Citations.svelte` was hard-sized at `size-4` (16×16 px), which can't fit two-digit overflows at the `text-[8px]` font size used. Reproduces on `0.9.2` and current `main`. ## Fix One CSS class change on `Citations.svelte:188`: - `size-4` → `min-w-4 h-4 px-1` - Added `whitespace-nowrap` for safety This keeps the perfect-circle look for single-digit overflows (visually consistent with the favicon row above) and lets the pill grow horizontally for multi-digit values. ## Testing Tested locally; the badge renders correctly for both single-digit and multi-digit overflow values. Pure CSS change, no JS or API impact. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>

GiteaMirror added the pull-request label 2026-05-16 01:28:40 -05:00

GiteaMirror closed this issue

2026-05-16 01:28:42 -05:00

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/open-webui#98653