southfox/AAII
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: southfox:ec4338378e82eaf97bec52f74ec786b6d216ba48
Branches Tags
southfox:master
...
compare: southfox:0998481fd48dd4a58081ee5c09328e237f1e3fac
Branches Tags
southfox:master

2 commits
ec4338378e ... 0998481fd4

Author SHA1 Message Date
SouthFox
0998481fd4 [style] expand message bubble max-width 2024-08-14 01:02:11 +08:00
SouthFox
c81e5e0651 [style] change loading indicator location 2024-08-14 00:58:27 +08:00
3 changed files with 5 additions and 8 deletions
Show stats Expand all files Collapse all files

6
static/index.html
View file

@ -11,15 +11,15 @@
<body> <body>
<div class="container bg-white rounded-lg shadow-md flex flex-col"> <div class="container bg-white rounded-lg shadow-md flex flex-col">
<h1 class="flex-none text-3xl font-bold mb-4 text-center">AAII</h1> <h1 class="flex-none text-3xl font-bold mb-4 text-center">AAII
<div class="typing-indicator" id="typingIndicator"></div>
</h1>
<div class="chat break-all" id="chatContainer"> <div class="chat break-all" id="chatContainer">
</div> </div>
<div class="flex-none flex"> <div class="flex-none flex">
<textarea type="text" id="userInput" placeholder="Type message here" class="outline-none flex-auto"></textarea> <textarea type="text" id="userInput" placeholder="Type message here" class="outline-none flex-auto"></textarea>
<button class="send-button flex-none" id="sendButton" >Send</button> <button class="send-button flex-none" id="sendButton" >Send</button>
</div> </div>
<div class="typing-indicator" id="typingIndicator">
</div>
</div> </div>
<script type="module" src="script.js"></script> <script type="module" src="script.js"></script>

2
static/script.js
View file

@ -95,7 +95,7 @@ let typingTimeout;
function showTypingIndicator() { function showTypingIndicator() {
clearTimeout(typingTimeout); clearTimeout(typingTimeout);
typingIndicator.style.display = "inline-block"; typingIndicator.style.display = "inline-flex";
} }
function hideTypingIndicator() { function hideTypingIndicator() {

5
static/style.css
View file

@ -56,7 +56,7 @@ body {
.message-bubble { .message-bubble {
padding: 12px 18px; padding: 12px 18px;
max-width: 70%; max-width: 95%;
border-radius: 20px; border-radius: 20px;
line-height: 1.6; line-height: 1.6;
font-size: 0.95rem; font-size: 0.95rem;
@ -146,9 +146,6 @@ input[type="text"] {
.typing-indicator { .typing-indicator {
display: none; display: none;
align-items: center;
justify-content: flex-end;
margin-top: 8px;
width: 10px; width: 10px;
height: 10px; height: 10px;
background-color: #333; background-color: #333;