radon/radchat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix scroll button and chat input styling

Browse Source
This commit is contained in:
Radon 2025-09-02 20:51:25 -05:00
parent 352dc84bcb
commit 4011a7a077
3 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
static/app.js
View File

@ -1937,10 +1937,10 @@ class EventHandlers {
chatMessages.addEventListener('scroll', function() {
const atBottom = UIManager.isChatScrolledToBottom();
if (!atBottom) {
$('#scroll-btn').style.display = 'block';
$('#scroll-btn').disabled = false;
}
if (atBottom) {
$('#scroll-btn').style.display = 'none';
$('#scroll-btn').disabled = true;
}
});

2
static/index.html
View File

@ -105,7 +105,7 @@
></textarea>
<label for="chat-input"></label>
<div class="chat-input-buttons">
<button id="scroll-btn" onclick="scrollChatToBottom()" style="display: none;">⮟</button>
<button id="scroll-btn" onclick="scrollChatToBottom()" disabled>⮟</button>
<!-- <input type="file" id="file-input" multiple style="display: none;"/>-->
<button id="file-btn" onclick='openFilePicker()'>📤</button>
<button id="emoji-btn" onclick="toggleEmojiPicker()">😀</button>

17
static/styles.css
View File

@ -795,8 +795,8 @@ main {
.chat-input-buttons {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(1, 1fr);
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 0.5rem;
}
@ -819,7 +819,8 @@ main {
}
#send-btn {
grid-column: 1 / 3;
grid-column: 1 / 4;
width: 100%;
}
@ -832,10 +833,7 @@ main {
transform: translateY(-2px);
}
#scroll-btn:disabled {
display: none;
}
#scroll-btn:disabled,
#send-btn:disabled,
#emoji-btn:disabled {
opacity: 0.5;
@ -1530,9 +1528,12 @@ button:disabled {
#chat-input {
padding: 0.75rem;
font-size: 16px;
min-width: 30vw;
/* Prevent zoom on iOS */
}
#file-btn,
#scroll-btn,
#send-btn,
#emoji-btn {
padding: 0.75rem 1rem;
@ -1618,7 +1619,7 @@ button:disabled {
}
main {
padding: 0.75rem;
padding: 0.05rem;
gap: 0.75rem;
}