tdpeuter/open-webui
tdpeuter/open-webui
1
Fork 0
forked from open-webui/open-webui
Code Issues Pull requests 1 Projects 1 Releases 2 Packages Activity Actions

fix: horizontal scroll issue on mobile

Browse source 
#1854
This commit is contained in:
Timothy J. Baek 2024-04-30 15:08:34 -07:00
parent 35437fb3a3
commit 27ff386115
2 changed files with 18 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/lib/components/chat/MessageInput/Suggestions.svelte
View file

@ -4,10 +4,10 @@
let prompts = [];
$: prompts =
suggestionPrompts.length <= 4
? suggestionPrompts
: suggestionPrompts.sort(() => Math.random() - 0.5).slice(0, 4);
$: prompts = suggestionPrompts;
// suggestionPrompts.length <= 4
// ? suggestionPrompts
// : suggestionPrompts.sort(() => Math.random() - 0.5).slice(0, 4);
</script>
<div class="w-full">

27
src/lib/components/layout/Sidebar.svelte
View file

@ -53,28 +53,29 @@
show = window.innerWidth > BREAKPOINT;
await chats.set(await getChatList(localStorage.token));
let touchstartX = 0;
let touchendX = 0;
let touchstart;
let touchend;
function checkDirection() {
const screenWidth = window.innerWidth;
const swipeDistance = Math.abs(touchendX - touchstartX);
if (swipeDistance >= screenWidth / 4) {
if (touchendX < touchstartX) {
const swipeDistance = Math.abs(touchend.screenX - touchstart.screenX);
if (touchstart.clientX < 40 && swipeDistance >= screenWidth / 4) {
if (touchend.screenX < touchstart.screenX) {
show = false;
}
if (touchendX > touchstartX) {
if (touchend.screenX > touchstart.screenX) {
show = true;
}
}
}
const onTouchStart = (e) => {
touchstartX = e.changedTouches[0].screenX;
touchstart = e.changedTouches[0];
console.log(touchstart.clientX);
};
const onTouchEnd = (e) => {
touchendX = e.changedTouches[0].screenX;
touchend = e.changedTouches[0];
checkDirection();
};
@ -84,14 +85,14 @@
}
};
document.addEventListener('touchstart', onTouchStart);
document.addEventListener('touchend', onTouchEnd);
window.addEventListener('touchstart', onTouchStart);
window.addEventListener('touchend', onTouchEnd);
window.addEventListener('resize', onResize);
return () => {
document.removeEventListener('touchstart', onTouchStart);
document.removeEventListener('touchend', onTouchEnd);
document.removeEventListener('resize', onResize);
window.removeEventListener('touchstart', onTouchStart);
window.removeEventListener('touchend', onTouchEnd);
window.removeEventListener('resize', onResize);
};
});