mirror of
https://github.com/duckietm/Nitro-V3.git
synced 2026-06-20 15:36:18 +00:00
fix(chat): keep flood warning inside the chat bar
The flood/mute warning was rendered inside the inline-grid input-sizer with no single-line constraint, so a long message (e.g. a large remaining time) wrapped to a second line and, with the bar's overflow-visible, spilled out the top. Give it its own centered, single-line, truncating container so it stays within the bar regardless of length.
This commit is contained in:
@@ -332,12 +332,14 @@ export const ChatInputView: FC<{}> = props =>
|
|||||||
onHover={ mention.setSelectedIndex }
|
onHover={ mention.setSelectedIndex }
|
||||||
/> }
|
/> }
|
||||||
<ChatInputStyleSelectorView chatStyleId={ chatStyleId } chatStyleIds={ chatStyleIds } selectChatStyleId={ updateChatStyleId } />
|
<ChatInputStyleSelectorView chatStyleId={ chatStyleId } chatStyleIds={ chatStyleIds } selectChatStyleId={ updateChatStyleId } />
|
||||||
<div className="flex-1 items-center input-sizer">
|
|
||||||
{ !floodBlocked &&
|
{ !floodBlocked &&
|
||||||
<input ref={ inputRef } className="w-full border-none bg-transparent px-[10px] text-[0.86rem] text-black placeholder:text-[#6c757d] focus:border-current focus:shadow-none focus:ring-0" maxLength={ maxChatLength } placeholder={ LocalizeText('widgets.chatinput.default') } type="text" value={ chatValue } onChange={ event => updateChatInput(event.target.value) } onMouseDown={ event => setInputFocus() } /> }
|
<div className="flex-1 items-center input-sizer">
|
||||||
|
<input ref={ inputRef } className="w-full border-none bg-transparent px-[10px] text-[0.86rem] text-black placeholder:text-[#6c757d] focus:border-current focus:shadow-none focus:ring-0" maxLength={ maxChatLength } placeholder={ LocalizeText('widgets.chatinput.default') } type="text" value={ chatValue } onChange={ event => updateChatInput(event.target.value) } onMouseDown={ event => setInputFocus() } />
|
||||||
|
</div> }
|
||||||
{ floodBlocked &&
|
{ floodBlocked &&
|
||||||
<Text variant="danger">{ LocalizeText('chat.input.alert.flood', [ 'time' ], [ floodBlockedSeconds.toString() ]) } </Text> }
|
<div className="flex min-w-0 flex-1 items-center px-[10px]">
|
||||||
</div>
|
<Text variant="danger" className="w-full truncate whitespace-nowrap text-[0.8rem] font-bold leading-none">{ LocalizeText('chat.input.alert.flood', [ 'time' ], [ floodBlockedSeconds.toString() ]) }</Text>
|
||||||
|
</div> }
|
||||||
<ChatInputEmojiSelectorView addChatEmoji={ addChatEmoji } />
|
<ChatInputEmojiSelectorView addChatEmoji={ addChatEmoji } />
|
||||||
</div>, document.getElementById('toolbar-chat-input-container'))
|
</div>, document.getElementById('toolbar-chat-input-container'))
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user