From eca2c6e01c46a90e56361b2470544455acd4f3df Mon Sep 17 00:00:00 2001
From: "LocalAI [bot]" <139863280+localai-bot@users.noreply.github.com>
Date: Mon, 2 Mar 2026 13:54:58 +0100
Subject: [PATCH] fix: Implement responsive line wrapping for model names
 (#8209) (#8720)

fix: Implement responsive line wrapping for model names on home page

- Changed model name display from truncate to break-words
- Increased max-width from 100px to 200px to allow more text
- This fixes issue #8209 for responsive text wrapping on smaller screens

Fixes: #8209

Co-authored-by: localai-bot <localai-bot@users.noreply.github.com>
---
 core/http/views/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/core/http/views/index.html b/core/http/views/index.html
index bad6832b9..a74977fec 100644
--- a/core/http/views/index.html
+++ b/core/http/views/index.html
@@ -499,7 +499,7 @@
                 {{ range .ModelsConfig }}
                     {{ if index $loadedModels .Name }}
                     <span class="inline-flex items-center gap-1 text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] transition-colors" data-loaded-model>
-                        <span class="truncate max-w-[100px]">{{.Name}}</span>
+                        <span class="break-words max-w-[200px]">{{.Name}}</span>
                         <button
                             @click="stopModel('{{.Name}}')"
                             class="text-red-400/60 hover:text-red-400 transition-colors ml-0.5"