SimpleChatTCRV:UI Cleanup: scrollOnlyIf, Tool HR, Msg Margin

Limit scroll to veritical dir and inturn show only when needed

Move the Tool Call Edit UI's HR into its div.

Add a bottom margin wrt the individual chat messages.
This commit is contained in:
hanishkvc 2025-11-11 12:17:01 +05:30
parent 29c2bafec8
commit c94471a56f
2 changed files with 5 additions and 6 deletions

View File

@ -44,14 +44,12 @@
<p> You need to have javascript enabled.</p> <p> You need to have javascript enabled.</p>
</div> </div>
<hr>
<div id="tool-div"> <div id="tool-div">
<div> <hr>
<div class="sameline"> <div class="sameline">
<textarea id="toolname-in" class="flex-grow" rows="1" placeholder="name of tool to run"></textarea> <textarea id="toolname-in" class="flex-grow" rows="1" placeholder="name of tool to run"></textarea>
<button id="tool-btn">run tool</button> <button id="tool-btn">run tool</button>
</div> </div>
</div>
<div class="sameline"> <div class="sameline">
<textarea id="toolargs-in" class="flex-grow" rows="2" placeholder="arguments to pass to the specified tool"></textarea> <textarea id="toolargs-in" class="flex-grow" rows="2" placeholder="arguments to pass to the specified tool"></textarea>
</div> </div>
@ -60,7 +58,6 @@
<hr> <hr>
<div class="sameline"> <div class="sameline">
<textarea id="user-in" class="flex-grow" rows="2" placeholder="enter your query to the ai model here" ></textarea> <textarea id="user-in" class="flex-grow" rows="2" placeholder="enter your query to the ai model here" ></textarea>
<!-- input id="file-btn" type="file">file</input -->
<button id="user-btn">submit</button> <button id="user-btn">submit</button>
</div> </div>

View File

@ -38,6 +38,8 @@
border-width: thin; border-width: thin;
border-radius: 2px; border-radius: 2px;
display: flex; display: flex;
margin-bottom: 2vh;
/* box-shadow: 1px 1px 4px lightslategray; */
} }
.chat-message-role { .chat-message-role {
border-style: dotted; border-style: dotted;
@ -101,7 +103,7 @@
} }
#chat-div { #chat-div {
overflow: scroll; overflow-y: auto;
flex-grow: 1; flex-grow: 1;
flex-shrink: 1; flex-shrink: 1;
min-height: 40vh; min-height: 40vh;