use details tag for chat
This commit is contained in:
parent
9f6535ace5
commit
ff05a8c2ee
1 changed files with 22 additions and 21 deletions
|
|
@ -23,30 +23,31 @@ const responses =
|
|||
|
||||
|
||||
const templateInjectChat = `
|
||||
<div class="fab">
|
||||
<div tabindex="0" role="button" class="btn btn-lg btn-circle btn-primary">
|
||||
<i data-lucide="stars"></i>
|
||||
</div>
|
||||
|
||||
<div class="card min-h-120 max-h-200 w-80 bg-base-300 p-4">
|
||||
<div class="w-full overflow-auto h-full" id="chat"></div>
|
||||
<div class="chat chat-start w-full hidden" id="chat-waiting">
|
||||
<div class="chat-bubble chat-bubble-primary whitespace-normal">
|
||||
<span class="loading loading-dots loading-md"></span>
|
||||
<details class="dropdown dropdown-top dropdown-end absolute right-4 bottom-4" id="chat-root">
|
||||
<summary class="btn btn-lg btn-circle btn-primary">
|
||||
<i data-lucide="stars"></i>
|
||||
</summary>
|
||||
<div class="dropdown-content card min-h-120 max-h-200 w-80 bg-base-300 p-4 mb-4">
|
||||
<div class="w-full overflow-auto h-full prose leading-5" id="chat"></div>
|
||||
<div class="chat chat-start w-full hidden" id="chat-waiting">
|
||||
<div class="chat-bubble chat-bubble-primary whitespace-normal">
|
||||
<span class="loading loading-dots loading-md"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="join mt-auto w-full">
|
||||
<div class="w-full">
|
||||
<label class="input join-item">
|
||||
<input type="text" id="chat-text" />
|
||||
</label>
|
||||
<div class="mt-4"></div>
|
||||
<div class="join mt-auto w-full">
|
||||
<div class="w-full">
|
||||
<label class="input join-item">
|
||||
<input type="text" id="chat-text" />
|
||||
</label>
|
||||
</div>
|
||||
<button class="btn btn-secondary join-item" id="send-chat">
|
||||
<i data-lucide="send"></i>
|
||||
</button>
|
||||
</div>
|
||||
<button class="btn btn-secondary join-item" id="send-chat">
|
||||
<i data-lucide="send"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>`
|
||||
</details>
|
||||
`
|
||||
|
||||
type ChatMessage = {
|
||||
type: "bot" | "user",
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue