2023-04-18 20:50:55 +00:00
|
|
|
<div class="flex h-screen w-screen">
|
2023-04-19 08:25:25 +00:00
|
|
|
<div class="w-1/4 flex flex-col rounded bg-gray-50 dark:bg-gray-700 text-white h-full overflow-hidden">
|
2023-04-19 04:49:44 +00:00
|
|
|
<div id="action-buttons" class="flex-shrink-0 h-10 ml-1.5 mt-2 mb-4">
|
2023-04-19 08:25:25 +00:00
|
|
|
<button id="new-discussion-btn" class="px-4 py-4 rounded bg-gray-400 dark:bg-gray-700 hover:bg-gray-600 dark:hover:bg-gray-600">
|
2023-04-18 20:50:55 +00:00
|
|
|
<img src="/static/images/new_message.png" class="w-5 h-5">
|
|
|
|
</button>
|
2023-04-19 08:25:25 +00:00
|
|
|
<button id="reset-discussions-btn" class="px-4 py-4 rounded bg-gray-400 dark:bg-gray-700 hover:bg-gray-600 dark:hover:bg-gray-600">
|
2023-04-18 20:50:55 +00:00
|
|
|
<img src="/static/images/reset_db.png" class="w-5 h-5">
|
|
|
|
</button>
|
2023-04-19 08:25:25 +00:00
|
|
|
<button value="Export" id="export-button" class="px-4 py-4 rounded bg-gray-400 dark:bg-gray-700 hover:bg-gray-600 dark:hover:bg-gray-600">
|
2023-04-18 20:50:55 +00:00
|
|
|
<img src="/static/images/export_database.png" class="w-5 h-5">
|
|
|
|
</button>
|
2023-04-19 08:25:25 +00:00
|
|
|
<button value="Export-discussion" id="export-discussion-button" class="px-4 py-4 rounded bg-gray-400 dark:bg-gray-700 hover:bg-gray-600 dark:hover:bg-gray-600">
|
2023-04-18 20:50:55 +00:00
|
|
|
<img src="/static/images/export_discussion.png" class="w-5 h-5">
|
|
|
|
</button>
|
|
|
|
</div>
|
2023-04-19 04:49:44 +00:00
|
|
|
<div class="flex-shrink-0 p-0 ml-1.5">
|
|
|
|
<h1 class="font-bold font-large text-black dark:text-white">Discussions</h1>
|
2023-04-18 20:50:55 +00:00
|
|
|
</div>
|
|
|
|
<div class="flex-1 overflow-y-auto p-0">
|
|
|
|
<div id="discussions-list" class="pb-96" >
|
2023-04-13 10:31:48 +00:00
|
|
|
</div>
|
2023-04-18 20:50:55 +00:00
|
|
|
</div>
|
2023-04-13 10:31:48 +00:00
|
|
|
</div>
|
2023-04-18 20:50:55 +00:00
|
|
|
<div class="flex-1 flex flex-col overflow-hidden">
|
2023-04-19 08:25:25 +00:00
|
|
|
<div class="flex-shrink-0 p-4 bg-gray-50 dark:bg-gray-700 pl-7 text-black dark:text-white">
|
2023-04-18 20:50:55 +00:00
|
|
|
<h1 class="font-bold font-large">Chat box</h1>
|
|
|
|
</div>
|
2023-04-19 08:25:25 +00:00
|
|
|
<div class="flex-grow overflow-y-auto p-0 bg-gray-50 dark:bg-gray-700 rounded">
|
2023-04-18 20:50:55 +00:00
|
|
|
<div id="chat-window" class="pb-96">
|
2023-04-13 10:31:48 +00:00
|
|
|
</div>
|
2023-04-18 20:50:55 +00:00
|
|
|
</div>
|
2023-04-13 10:31:48 +00:00
|
|
|
</div>
|
2023-04-18 20:50:55 +00:00
|
|
|
</div>
|
2023-04-19 08:25:25 +00:00
|
|
|
<div class="w-full flex justify-center">
|
|
|
|
<div class="w-full flex bottom-0 fixed rounded-sm shadow shadow-white bg-gray-300 p-1 dark:bg-gray-500 flex-wrap">
|
|
|
|
<form id="chat-form" class="w-full flex-row text-white mr-15 p-15">
|
|
|
|
<input type="text" id="user-input" placeholder="Type your message..." class="dark:bg-gray-600 pl-1 pr-1 py-1 my-1 mr-2 text-black dark:text-white outline-none drop-shadow-sm w-full rounded-md flex-1">
|
|
|
|
<div id="wait-animation" style="display: none;" class="lds-facebook bg-secondary my-1 mx-1 outline-none drop-shadow-sm w-full rounded-md p-2"><div></div><div></div><div></div></div>
|
|
|
|
<input type="submit" value="Send" id="submit-input" class="my-1 mx-1 outline-none px-4 dark:bg-gray-900 text-black dark:text-white rounded-md hover:bg-[#7ba0ea] active:bg-[#3d73e1] transition-colors ease-in-out">
|
|
|
|
</form>
|
|
|
|
</div>
|
2023-04-18 20:50:55 +00:00
|
|
|
</div>
|
2023-04-19 08:25:25 +00:00
|
|
|
|