shinalok/youlbot-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: suppress .generating blue border during Gradio streaming

Browse Source 
Root cause: Gradio adds .generating class to .wrap elements during
streaming, which applies 2px solid blue border via theme CSS.

Fix: .wrap.generating { border-color: primary; border-width: 1px }
Verified: 0 blue borders on wrap elements after message send.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
shinalok
2026-06-02 19:01:34 +09:00
co-authored by Claude Sonnet 4.6
parent 9f1a43095e
commit 7f4aeb54e2
1 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app.py
+8 -3
View File
@@ -463,17 +463,22 @@ _JS = """
_CUSTOM_CSS = """ _CUSTOM_CSS = """
footer { display: none !important; } footer { display: none !important; }
/* Gradio .wrap:focus-within 전역 제거 (모든 컴포넌트 파란 테두리 원인) */ /* 스트리밍 중 파란 테두리 제거 (.generating 클래스가 원인) */
.wrap.generating {
border-color: var(--border-color-primary) !important;
border-width: 1px !important;
}
/* focus-within 전역 제거 */
.wrap:focus-within { .wrap:focus-within {
box-shadow: none !important; box-shadow: none !important;
border-color: var(--border-color-primary) !important; border-color: var(--border-color-primary) !important;
} }
/* pill-input wrap에만 포커스 스타일 복원 */ /* pill-input에만 포커스 스타일 복원 */
.pill-input .wrap:focus-within { .pill-input .wrap:focus-within {
border-color: #3b82f6 !important; border-color: #3b82f6 !important;
box-shadow: 0 0 0 3px rgba(59,130,246,.10) !important; box-shadow: 0 0 0 3px rgba(59,130,246,.10) !important;
} }
/* block, container 레벨 focus-within도 제거 */ /* block 레벨 focus 제거 */
.gradio-container .block:focus-within, .gradio-container .block:focus-within,
.gradio-container .block:focus { .gradio-container .block:focus {
box-shadow: none !important; box-shadow: none !important;