diff --git a/css/main.css b/css/main.css index 6c658546..b4ec0589 100644 --- a/css/main.css +++ b/css/main.css @@ -689,6 +689,15 @@ div.svelte-362y77>*, div.svelte-362y77>.form>* { max-width: 300px; margin-left: calc(-0.5*(var(--document-width) - 880px - 14px - 16px * 2)); } + + #chat-controls { + position: absolute; + top: 16px; + right: 0; + width: calc(0.5*(var(--document-width) - 880px - 120px - 16px*2)); + max-width: 300px; + margin-right: calc(-0.5*(var(--document-width) - 880px - 14px - 16px * 2)); + } } /* ---------------------------------------------- diff --git a/modules/ui_chat.py b/modules/ui_chat.py index 7576628d..ad4a4f0f 100644 --- a/modules/ui_chat.py +++ b/modules/ui_chat.py @@ -77,12 +77,16 @@ def create_ui(): shared.gradio['rename_to-confirm'] = gr.Button('Confirm', visible=False, elem_classes='refresh-button') shared.gradio['rename_to-cancel'] = gr.Button('Cancel', visible=False, elem_classes='refresh-button') - with gr.Row(): - shared.gradio['start_with'] = gr.Textbox(label='Start reply with', placeholder='Sure thing!', value=shared.settings['start_with']) + with gr.Row(elem_id='chat-controls', elem_classes=['pretty_scrollbar']): + with gr.Column(): + with gr.Row(): + shared.gradio['start_with'] = gr.Textbox(label='Start reply with', placeholder='Sure thing!', value=shared.settings['start_with'], elem_classes=['add_scrollbar']) - with gr.Row(): - shared.gradio['mode'] = gr.Radio(choices=['chat', 'chat-instruct', 'instruct'], value='chat', label='Mode', info='Defines how the chat prompt is generated. In instruct and chat-instruct modes, the instruction template selected under Parameters > Instruction template must match the current model.', elem_id='chat-mode') - shared.gradio['chat_style'] = gr.Dropdown(choices=utils.get_available_chat_styles(), label='Chat style', value=shared.settings['chat_style'], visible=shared.settings['mode'] != 'instruct') + with gr.Row(): + shared.gradio['mode'] = gr.Radio(choices=['chat', 'chat-instruct', 'instruct'], value='chat', label='Mode', info='Defines how the chat prompt is generated. In instruct and chat-instruct modes, the instruction template selected under Parameters > Instruction template must match the current model.', elem_id='chat-mode') + + with gr.Row(): + shared.gradio['chat_style'] = gr.Dropdown(choices=utils.get_available_chat_styles(), label='Chat style', value=shared.settings['chat_style'], visible=shared.settings['mode'] != 'instruct') def create_chat_settings_ui():