Toggle menubar on mobile
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful

This commit is contained in:
Guillem Borrell 2024-06-12 09:22:58 +02:00
parent 1b5efa99b5
commit 102fc816f8
3 changed files with 13 additions and 3 deletions

View file

@ -124,8 +124,8 @@
</div>
<div class="chat-input">
<div class="input-group">
<textarea id="chatTextarea" class="form-control" placeholder="Type a message..." rows="1"
style="resize: none;"></textarea>
<textarea id="chatTextarea" class="form-control" placeholder="Type a message..."
rows="1"></textarea>
<div class="input-group-append">
<button id="sendButton" class="btn btn-primary" type="button">Send</button>
</div>

View file

@ -13,6 +13,16 @@ $('#menu-toggle').click(function (e) {
toggleMenuArrow(document.getElementById('menu-toggle'));
});
document.addEventListener("DOMContentLoaded", function () {
console.log('Width: ' + window.innerWidth + ' Height: ' + window.innerHeight);
if ((window.innerWidth <= 800) && (window.innerHeight <= 600)) {
$('#sidebar').toggleClass('toggled');
toggleMenuArrow(document.getElementById('menu-toggle'));
console.log('Mobile device detected. Hiding sidebar.');
}
}
);
const textarea = document.getElementById('chatTextarea');
const sendButton = document.getElementById('sendButton');
const chatMessages = document.querySelector('.chat-messages');

View file

@ -57,7 +57,7 @@ html {
.chat-input {
position: fixed;
bottom: 0;
width: calc(100% - 250px);
width: 100%;
/* Adjust width considering the sidebar */
max-width: 600px;
background: #fff;