Update layout of Reasoning settings block

98ea463e0e549c31b7968f0f86eb443f96581d98

Cohee <18619528+Cohee1207@users.noreply.github.com>

Parents: d5959a4681481582640b78c4c73a0a3208a6421f
2 files changed, +46 -35Ignore whitespace
public/index.html+44 -35
@@ -3750,7 +3750,7 @@
37503750 <label class="checkbox_label" for="custom_stopping_strings_macro">
37513751 <input id="custom_stopping_strings_macro" type="checkbox" checked>
37523752 <small data-i18n="Replace Macro in Custom Stopping Strings">
37533753 Replace Macro in Custom StoppingStop Strings
37543754 </small>
37553755 </label>
37563756 </div>
@@ -3797,44 +3797,53 @@
37973797 <span data-i18n="Reasoning">Reasoning</span>
37983798 </h4>
37993799 <div>
3800- <label class="checkbox_label" for="reasoning_auto_parse" title="Automatically parse reasoning blocks from main content between the reasoning prefix/suffix. Both fields must be defined and non-empty." data-i18n="[title]reasoning_auto_parse">
3800+ <div class="flex-container alignItemsBaseline">
3801- <input id="reasoning_auto_parse" type="checkbox" />
3801+ <label class="checkbox_label flex1" for="reasoning_auto_parse" title="Automatically parse reasoning blocks from main content between the reasoning prefix/suffix. Both fields must be defined and non-empty." data-i18n="[title]reasoning_auto_parse">
3802- <small data-i18n="Auto-Parse Reasoning">
3802+ <input id="reasoning_auto_parse" type="checkbox" />
3803- Auto-Parse Reasoning
3803+ <small data-i18n="Auto-Parse">
3804- </small>
3804+ Auto-Parse
38053805 </labelsmall>
3806- <label class="checkbox_label" for="reasoning_auto_expand" title="Automatically expand reasoning blocks." data-i18n="[title]reasoning_auto_expand">
3806+ </label>
3807- <input id="reasoning_auto_expand" type="checkbox" />
3807+ <label class="checkbox_label flex1" for="reasoning_auto_expand" title="Automatically expand reasoning blocks." data-i18n="[title]reasoning_auto_expand">
3808- <small data-i18n="Auto-Expand Reasoning">
3808+ <input id="reasoning_auto_expand" type="checkbox" />
3809- Auto-Expand Reasoning
3809+ <small data-i18n="Auto-Expand">
3810- </small>
3810+ Auto-Expand
38113811 </labelsmall>
3812- <label class="checkbox_label" for="reasoning_add_to_prompts" title="Add existing reasoning blocks to prompts. To add a new reasoning block, use the message edit menu." data-i18n="[title]reasoning_add_to_prompts">
3812+ </label>
3813- <input id="reasoning_add_to_prompts" type="checkbox" />
3813+ </div>
3814- <small data-i18n="Add Reasoning to Prompts">
3814+ <div class="flex-container alignItemsBaseline">
3815- Add Reasoning to Prompts
3815+ <label class="checkbox_label flex1" for="reasoning_add_to_prompts" title="Add existing reasoning blocks to prompts. To add a new reasoning block, use the message edit menu." data-i18n="[title]reasoning_add_to_prompts">
3816- </small>
3816+ <input id="reasoning_add_to_prompts" type="checkbox" />
3817- </label>
3817+ <small data-i18n="Add to Prompts">
3818- <div class="flex-container">
3818+ Add to Prompts
3819- <div class="flex1" title="Inserted before the reasoning content." data-i18n="[title]reasoning_prefix">
3819+ </small>
3820- <small data-i18n="Prefix">Prefix</small>
3820+ </label>
3821- <textarea id="reasoning_prefix" class="text_pole textarea_compact autoSetHeight"></textarea>
3821+ <div class="flex1 flex-container alignItemsBaseline" title="Maximum number of reasoning blocks to be added per prompt, counting from the last message." data-i18n="[title]reasoning_max_additions">
3822- </div>
3822+ <input id="reasoning_max_additions" class="text_pole textarea_compact widthUnset" type="number" min="0" max="999"></textarea>
3823- <div class="flex1" title="Inserted after the reasoning content." data-i18n="[title]reasoning_suffix">
3823+ <small data-i18n="Max">Max</small>
3824- <small data-i18n="Suffix">Suffix</small>
3825- <textarea id="reasoning_suffix" class="text_pole textarea_compact autoSetHeight"></textarea>
38263824 </div>
38273825 </div>
3828- <div class="flex-container">
3826+ <details>
3829- <div class="flex1" title="Inserted between the reasoning and the message content." data-i18n="[title]reasoning_separator">
3827+ <summary data-i18n="Reasoning Formatting">
3830- <small data-i18n="Separator">Separator</small>
3828+ Reasoning Formatting
3831- <textarea id="reasoning_separator" class="text_pole textarea_compact autoSetHeight"></textarea>
3829+ </summary>
3830+ <div class="flex-container">
3831+ <div class="flex1" title="Inserted before the reasoning content." data-i18n="[title]reasoning_prefix">
3832+ <small data-i18n="Prefix">Prefix</small>
3833+ <textarea id="reasoning_prefix" class="text_pole textarea_compact autoSetHeight"></textarea>
3834+ </div>
3835+ <div class="flex1" title="Inserted after the reasoning content." data-i18n="[title]reasoning_suffix">
3836+ <small data-i18n="Suffix">Suffix</small>
3837+ <textarea id="reasoning_suffix" class="text_pole textarea_compact autoSetHeight"></textarea>
3838+ </div>
38323839 </div>
3833- <div class="flex1" title="Maximum number of reasoning blocks to be added per prompt, counting from the last message." data-i18n="[title]reasoning_max_additions">
3840+ <div class="flex-container">
3834- <small data-i18n="Max Additions">Max Additions</small>
3841+ <div class="flex1" title="Inserted between the reasoning and the message content." data-i18n="[title]reasoning_separator">
3835- <input id="reasoning_max_additions" class="text_pole textarea_compact" type="number" min="0" max="999"></textarea>
3842+ <small data-i18n="Separator">Separator</small>
3843+ <textarea id="reasoning_separator" class="text_pole textarea_compact autoSetHeight"></textarea>
3844+ </div>
38363845 </div>
38373846 </divdetails>
38383847 </div>
38393848 </div>
38403849 <div>
public/style.css+2 -0
@@ -5746,11 +5746,13 @@ body:not(.movingUI) .drawer-content.maximized {
57465746 overflow-wrap: anywhere;
57475747}
57485748
5749+#SystemPromptColumn summary,
57495750#InstructSequencesColumn summary {
57505751 font-size: 0.95em;
57515752 cursor: pointer;
57525753}
57535754
5755+#SystemPromptColumn details,
57545756#InstructSequencesColumn details:not(:last-of-type) {
57555757 margin-bottom: 5px;
57565758}