Wrap thonk into collapsible

144277bdcc5ac110d888510b79d0ad6a8d92873a

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

public/index.html+6 -1 Viewed

                             <div class="mes_edit_cancel menu_button  fa-solid fa-xmark" title="Cancel" data-i18n="[title]Cancel"></div>
                         </div>
                     </div>
-                    <div class="mes_reasoning"></div>
+                    <details class="mes_reasoning_details">
+                        <summary class="mes_reasoning_summary">
+                            <span data-i18n="Reasoning">Reasoning</span>
+                        </summary>
+                        <div class="mes_reasoning"></div>
+                    </details>
                     <div class="mes_text"></div>
                     <div class="mes_img_container">
                         <div class="mes_img_controls">

public/style.css+11 -2 Viewed

     padding: 5px;
     margin: 5px 0;
     overflow-y: auto;
-    max-height: 100px;
+    max-height: min(50vh, 300px);
+}
-.mes_block:has(.edit_textarea) .mes_reasoning,
+.mes_reasoning_summary {
+    cursor: pointer;
+}
+.mes_reasoning_summary > span {
+    margin-left: 5px;
+}
+.mes_reasoning_details:has(.mes_reasoning:empty),
+.mes_block:has(.edit_textarea) .mes_reasoning_details,
 .mes_bias:empty,
 .mes_reasoning:empty {
     display: none;